无法在APP_INITIALIZER定义中实例化循环依赖性

时间:2018-07-01 08:33:06

标签: angular angular5 cyclic-dependency

我遇到错误无法实例化循环依赖性! ApplicationRef(“ [ERROR->]”):在./AppModule@-1:-1 的NgModule AppModule中,但我看不出问题出在哪里。您能否提一些建议?我是Angular 2的新手,问题似乎出在 provider 部分的NgModule中的 app.module.ts 文件中,其中是 APP_INITIALIZER 。只要将 AuthenticationService 添加到 deps 部分中,它就会发生。当我删除 APP_INITIALIZER 定义时,它消失了。非常感谢。

文件app.module.ts:

export function fetchAuthenticatedUser(authService: AuthenticationService): Function {
   return () => authService.fetchAuthenticatedUser();
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    CoreModule,
    AppRoutingModule,
  ],
  providers: [
    HttpClient,
    {
      provide: APP_INITIALIZER,
      useFactory: fetchAuthenticatedUser,
      deps: [AuthenticationService], // !!! The problem seems to be caused by this dependency. If I remove entire APP_INITIALIZER definition from providers it disappears.
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

文件core.module.ts:

@NgModule({
  imports: [
    CommonModule,
    FormsModule
  ],
  providers: [
    AuthenticationService,
    OAuthTokenService,
    AuthenticationGuard,
    ApiService,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: OauthInterceptor,
      deps: [AuthenticationService],
      multi: true
    },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: ErrorInterceptor,
      deps: [AuthenticationService, NotificationsService],
      multi: true
    }
  ],
  declarations: [
    HeaderComponent
  ],
  exports: [
    HeaderComponent
  ]
})
export class CoreModule {
  constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
    if (parentModule) {
      throw new Error(`${parentModule} has already been loaded. Import Core module in the AppModule only.`);
    }
  }
}

文件authentication.service.ts:

@Injectable()
export class AuthenticationService implements OnInit {
  constructor(private tokenService: OAuthTokenService, private api: ApiService, private router: Router) { }
  ...
}

oauth-token.service.ts文件:

@Injectable()
export class OAuthTokenService {
  constructor() { }
  ...
}

文件api.service.ts:

@Injectable()
export class ApiService {
  constructor(private configService: ConfigurationService, private http: HttpClient, private tokenService: OAuthTokenService, private router: Router) { }
}

文件configuration.service.ts:

@Injectable()
export class ConfigurationService {
    private config: Configuration; // A plain class (value object)

    constructor(private http: HttpClient) {}

    static startupServiceFactory(configService: ConfigurationService): Function {
        return () => configService.load();
    }

    load() {
        ...
    }
}

文件package.json:

{
  "dependencies": {
    "@angular/animations": "^5.2.0",
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/router": "^5.2.0",
    "angular2-notifications": "^1.0.2",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "font-awesome": "^4.7.0",
    "jquery": "^3.3.1",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "~1.7.4",
    "@angular/compiler-cli": "^5.2.0",
    "@angular/language-service": "^5.2.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "~2.5.3"
  }
}

0 个答案:

没有答案