在我的angular应用程序中输入APP_INITIALIZER时，出现"this.appInits[i]不是一个函数“的错误

Question

我正在尝试在我的站点中实现https://www.npmjs.com/package/keycloak-angular，这样我的前端angular应用程序就可以使用Keycloak对用户进行身份验证。

在放入代码后，我一直收到以下错误：

ERROR TypeError: this.appInits[i] is not a function
    at ApplicationInitStatus.runInitializers (core.es5.js?de3d:2807)
    at eval (core.es5.js?de3d:4506)

有人知道为什么会发生这种事吗？我使用的是Angular 4.3.2和keycloak-angular 7.2.0以及keycloak-js 8.0.2。

以下是我的大部分app.module.ts：

import {NgModule, APP_INITIALIZER} from '@angular/core';
import { KeycloakService, KeycloakAngularModule } from 'keycloak-angular';
import { initializer } from './utils/app-init';
...

@NgModule({
    imports: [
        ...
        KeycloakAngularModule
    ],
    declarations: [
        ...
    ],
    providers: [
        ...
        {
            provide: APP_INITIALIZER,
            useFactory: initializer,
            multi: true,
            deps: [KeycloakService],

            useClass: OdpToastOptions
        }
    ],
    bootstrap: [JhiMainComponent]
})

export class UiAppModule {}

下面是我的app-init.ts：

export function initializer(keycloak: KeycloakService): () => Promise<any> {

    keycloak.init({
        config: {
            url: 'https://keycloak.mydomain.com/auth',
            realm: 'myrealm',
            clientId: 'myclient',
        },
        initOptions: {
            onLoad: 'login-required',
            checkLoginIframe: false,
        },
        enableBearerInterceptor: true,
        bearerExcludedUrls: ['/assets', '/clients/public'],
    });

    return (): Promise<any> => keycloak.init();
}

Answer 1

您不能在提供程序中同时拥有useFactory和useClass。我想应该从这个提供程序中删除useClass: OdpToastOptions：

{
    provide: APP_INITIALIZER,
    useFactory: initializer,
    multi: true,
    deps: [KeycloakService],

    useClass: OdpToastOptions // <-- REMOVE LINE
}

这可能会解决这个问题：

{
    provide: APP_INITIALIZER,
    useFactory: initializer,
    multi: true,
    deps: [KeycloakService],
}