Question

我正在尝试在最新的Angular2 2.1.0中正确设置@NgModule。我有一些依赖于其他可注入代码的可注入代码，并且由于某种原因，依赖性没有被初始化。

当应用启动时，我收到以下错误：core.umd.js:3076 TypeError: Cannot read property 'getTokenPromise' of undefined at Object.tokenGetter (app.module.ts:68)

在这种情况下，未定义的对象是行unifiedLogin

中的return unifiedLogin.getTokenPromise();

我预计UnifiedLogin登录会被注入AuthHttp并初始化，但事实并非如此。

这是一个相当大的项目，所以我只包括我希望的相关代码片段。

这是我的@NgModule语句的一部分，来自app.modules.ts

import { BrowserModule } from '@angular/platform-browser';
import { HttpModule, Http } from '@angular/http';
import { AppRoutingModule } from './app-routing.module';
import { AuthHttp, AuthConfig } from 'angular2-jwt';
import { UnifiedLogin } from './unified-login';
import { AppComponent }  from './app.component';

...

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        HttpModule,
        AppRoutingModule
    ],
    providers: [
        UnifiedLogin,
        {
            provide: AuthHttp,
            useFactory: (http: Http, unifiedLogin: UnifiedLogin) => {
                return new AuthHttp(new AuthConfig({
                    tokenGetter: (() => {
                        return unifiedLogin.getTokenPromise();
                    })
                }), http);
            },
            deps: [UnifiedLogin]
        }
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

以下是我希望初始化并注入AuthHttp的UnifiedLogin代码，但不是

import { Injectable } from '@angular/core';

...

@Injectable()
export class UnifiedLogin {

    ... 

    public getTokenPromise(): Promise<string> {
        return this._storage.get('id_token');
    }   
}

Answer 1

您需要列出deps函数中使用的useFactory中的依赖项。由于您只列出deps: [UnifiedLogin]，UnifiedLogin作为useFactory函数的第一个参数传递，第二个参数什么都没有。

您应该将Http添加到deps，以便相应地解析参数

{
    provide: AuthHttp,
    useFactory: (http: Http, unifiedLogin: UnifiedLogin) => {
        return new AuthHttp(new AuthConfig({
            tokenGetter: (() => {
                return unifiedLogin.getTokenPromise();
            })
        }), http);
    },
    deps: [Http, UnifiedLogin]   <====== Http
}

@NgModule中的依赖注入不起作用Angular2 2.1.0

1 个答案: