Angular2 Spinner httpInterceptor 在 prebootstrap（app initizer）中加载配置

Question

我正在尝试将 1.3 中的现有代码迁移到 2。我有一个在应用程序启动之前加载的配置服务。我还需要展示一个使用 httpInterceptor 的微调器。我在 App 组件中订阅了 SpinnerService Observable。但是由于 http 调用是在引导之前进行的，因此 observable 始终是未定义的。

  @NgModule({
imports: [BrowserModule, FormsModule, HttpModule, RouterModule,SharedModule, AppRoutingModule
providers: [

    {
        provide: Http,
        useFactory: (backend:XHRBackend, options:CustomOptions) => {
            return new HttpService(backend, options, new SpinnerService());
        },
        deps: [XHRBackend, RequestOptions]
    },
    SpinnerService ,
    ConfigService,
    {
        provide: APP_INITIALIZER,
        useFactory: (config: ConfigService) => () => config.loadConfig(),
        deps: [ConfigService],
        multi: true
    },
    {
        provide: RequestOptions,
        useClass: CustomOptions

    },
],
declarations: [AppComponent ],

bootstrap: [AppComponent]

})

app.component.ts

中的方法

private createServiceSubscription() {
    this.subscription = this.spinnerService.spinnerObservable.subscribe(show => {
        if (show) {
            this.startSpinner();
        } else {
            this.stopSpinner();
        }
    });
}

旋转器服务： 导出 class SpinnerService {

public spinnerObserver: Observer<boolean>;
public spinnerObservable: Observable<boolean>;

constructor() {

    this.spinnerObservable = new Observable<boolean>((observer: Observer<boolean>)  => {
            this.spinnerObserver = observer;
        }
    ).share();
}

showSpinner() {
    if (this.spinnerObserver) {
        this.spinnerObserver.next(true);
    }
}

hideSpinner() {
    if (this.spinnerObserver) {
        this.spinnerObserver.next(false);
    }
}

有没有一种方法可以直接从 prebootstrap

使用 customHttpService 来显示微调器

}

Answer 1

使用 BehaviorSubject。 BehaviorSubject 发出一个初始值，订阅者将立即获得。

//private
this.spinnerObserver = new BehaviorSubject<boolean>(false);

//public
this.spinnerObservable = this.spinnerObserver.asObservable().share();

Angular2 Spinner httpInterceptor 在 prebootstrap（app initizer）中加载配置

Angular2 Spinner httpInterceptor with loading config in prebootstrap (app initizer)

angular

angular2-services

angular2-observables