LoadingChangedAfterItHasBeenCheckedErrorサービスの読み込み

Question

私は、アプリケーションの各http.getアクションにローディングスピナーを追加しようとしています。ここで

は私http.getです：

protected get(url: string): any { 

    //Loading start 
    this.sessionService.showLoader(); 
    (...) 
} 

SessionServiceは私LoadingServiceを呼び出します。ここ

constructor(private cookieService: CookieService, private loadingService : LoadingService) { 

} 

public showLoader(): void { 
    this.loadingService.show(); 
} 

public hideLoader(): void { 
    this.loadingService.hide(); 
} 

は私のサービスはLoadingService

import { Injectable, OnInit, EventEmitter } from '@angular/core'; 

@Injectable() 
export class LoadingService implements OnInit { 


    public loadingEvent: EventEmitter<boolean>; 


    constructor() { 
    this.loadingEvent = new EventEmitter(); 
    } 

    ngOnInit() { 
    this.loadingEvent.emit(false); 
    } 


    show() { 
    this.loadingEvent.emit(true); 

    } 

    hide() { 
    this.loadingEvent.emit(false); 
    } 

} 

あるし、ここの一部であります私の主なレイアウトコンポーネント：

showLoadingDiv : boolean; 

    constructor(public loadingService : LoadingService) { 
    } 

    ngOnInit() { 

    } 


    ngAfterViewInit(){ 
    this.loadingService.loadingEvent.subscribe((res) => { 
     this.showLoadingDiv = res; 
    }); 
    } 

そして最後に、私のHTMLレイアウトテンプレートで：

<div class="loaddiv" *ngIf="showLoadingDiv"> 
Loading... 
</div> 

、他のモジュールがロード速い場合、私はエラーExpressionChangedAfterItHasBeenCheckedErrorを持っていないが、モジュールは（膨大なデータので）少し時間がかかる場合は、私はこのエラーがあります。私はすでに、これはSOではなく、私のために働く見てる

：ngAfterViewInitライフサイクルフックで値を変更する場合 https://stackoverflow.com/a/38846793/1729211

Answer 1

エラーが発生します。 setTimeout（）の.subscribeにコードをラップするのが速い方法です。これについて深く説明した良い記事がありましたが、私はそれを私の電話で見つけることができません、おそらく誰かがそれを投稿することができます。