angular - 无法实例化循环依赖! ApplicationRef ("[ERROR ->]") : in NgModule AppModule in ./AppModule@-1:-1

Question

I have added this code into my app.module.ts

    providers: [ AppConfigService,
            {
                provide: APP_INITIALIZER,
                useFactory: (config: AppConfigService) => () => config.getAppConfig(),
                deps: [AppConfigService],
                multi: true
            },
]

出现这个错误

问题:我用过ngx-permission pkg 以获得许可。我设置了route权限方法。但是当我刷新一个页面时，那个时候在主页上重定向而不是停留在当前页面上。所以我试了to load permissions before application start up method用于解决此问题但出现此错误。

 config.getAppConfig() // call when application start up

有什么想法请帮忙。也欢迎其他解决方案。

Answer 1

当您的 APP_INITIALIZER 中的依赖项依赖于 Angular 服务时，例如路由器。

解决方案是延迟注入(inject)，方法是更改​​服务的构造函数以接受 Injector，然后在构造函数外部解析值。

示例 AppConfigService:

import { Injectable, Injector } from '@angular/core';
import { Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class AppConfigService {

  // Helper property to resolve the service dependency.
  private get _router() { return this._injector.get(Router); }

  constructor(
    //private _router: Router
    private _injector: Injector
  ) { }

  navigate() {
    this._router.navigate(['/']);
  }
}