Angular 8 Запуск службы APP_INITIALIZER перед загрузкой файла конфигурации - PullRequest
3 голосов
/ 27 мая 2020

У меня проблемы с загрузкой файла конфигурации с помощью Angular APP_INITIALIZER.

Кажется, служба начала загружаться с APP_INTIALIZER, поэтому файл конфигурации не доходит до службы и вызывает ошибку до того, как потребуется файл конфигурации чтобы установить что-то перед запуском службы.

это AppModule

export function load(http: HttpClient, config: AppConfigurationService):
(() => Promise<boolean>) {
return (): Promise<boolean> => {
    return new Promise<boolean>((resolve, reject): void => {
        http.get('/assets/config/config.json').
            pipe(
                map((res: AppConfigurationService) => {
                    config.defaultLanguage = res.defaultLanguage;
                    config.languages = res.languages;
                    config.title = res.title;
                    config.logo = res.logo;
                    resolve(true);
                }), catchError((error: { status: number }, caught: Observable<void>): ObservableInput<{}> => {
                    reject('could not download webpages duo to the application maintenance');
                    return of(error);
                })
            ).subscribe();
    }).then(res => {
        if (res) {
            return new Promise<boolean>((resolve, reject): void => {
                if (config) {
                    console.log(config, ' config is being produced?');
                    resolve(true);
                } else {
                    reject('Not Found')
                }
            });
        }
    });
};} 
     @NgModule({
declarations: [
    AppComponent,
    RootComponent,
],
imports: [
    BrowserModule.withServerTransition({ appId: 'serverApp' }),
    TransferHttpCacheModule,
    AppRoutingModule,
    SharedModule,
],
providers: [
    {
        provide: APP_INITIALIZER,
        useFactory: load,
        multi: true,
        deps: [
            HttpClient,
            AppConfigurationService
        ]
    }
],
bootstrap: [AppComponent],
entryComponents: [
    DialogServiceComponent
],}) export class AppModule { }

Здесь произошла ошибка

В AppRoutingModule я использую CanActive, чтобы проверить, есть ли пользователь позволяет пройти с некоторым условием

    {
        path: 'home',
        component: homeComponent,
        canActivate: [CheckUserService]
    },

CheckUserService собирается проверить определенное условие для пользователя, который вошел на страницу, если он не соответствует, появится MatDialog

if (isLoggedIn) {
        if(!userCondition){
              this.openDialog();
              return true;
           }
           return true;
        }
    } else {
        return true;
    }

     openDialog() {
    const dialogRef = 
        this.dialog.open(DialogServiceComponent, {
        width: '1000px',
        panelClass: 'my-dialog',
        disableClose: true
    });

    dialogRef.afterClosed().subscribe(result => {
        console.log(`Dialog result: ${result}`);
    });
}

И в DialogServiceComponent собирается получить файл конфигурации в AppConfig, прежде чем он сможет запустить API, но поскольку app_initializer не завершен, ошибка появляется из-за того, что файл конфигурации еще не завершен.

Как решить эту проблему, я совершенно не уверен, что это правильный способ написать APP_INITIALIZER

1 Ответ

0 голосов
/ 08 июня 2020

Я исправляю проблему, удалив initialNavigation из AppRoutingModule

строка добавляется автоматически, если вы обновляете angular версию 7 -> 8.

Подробнее о проблеме можно прочитать здесь https://github.com/angular/universal/issues/1623

@NgModule({
imports: [RouterModule.forRoot(routes, {
    scrollPositionRestoration: 'enabled',
    anchorScrolling: 'enabled',
    // initialNavigation: 'enabled'
})],
exports: [RouterModule]
 })
export class AppRoutingModule { }
...