Angular 4 ExpressionChangedAfterItHasBeenCheckedError con osservabile ma non promettente - angolare, modello angolare

Sto riscontrando questo errore quando un bambinocomponente imposta il testo in un altro componente attraverso un servizio condiviso. Ciò accade quando il componente figlio sottoscrive un servizio Osservabile dal servizio di traduzione angolare nel suo onInit gancio. Tuttavia, se cambio l'osservabile in una promessa (.toPromise().then(..) al di sopra di .subscribe(..)il problema sparisce.

Mi piacerebbe capire perché

La mia configurazione ...

root.component.html:

<app-page-title>{{ "STRINGS.loading" | translate }}</app-page-title>
<div>
<!-- view component rendered here -->
<router-outlet (activate)="onActivate($event)"></router-outlet>
</div>

page-title.service.ts:

getPageTitle() {
return this.pageTitle;
}
setPageTitle(pageTitle: string) {
this.pageTitle = pageTitle;
}

Pagina-title.component.html:

<div>
<div *ngIf="isBack()">
<div class="page-title-text">
{{getPageTitle()}}
</div>
...
</div>
</div>

view.component.ts:

ngOnInit() {
// Triggers ExpressionChangedAfterItHasBeenCheckedError
this.translationService.get("VIEW.title").subscribe(pageTitle => this.titleService.setPageTitle(pageTitle));

// Works
// this.translationService.get("VIEW.title").toPromise().then(pageTitle => this.titleService.setPageTitle(pageTitle));

}

Un'altra cosa da notare è, questa è una SPA. L'errore si manifesta solo quando si carica view.component tramite javascript navigando attraverso l'app. Se nella vista in cui si presenta questo problema, e clicco su Aggiorna, l'errore non si verifica.

Ho letto un po 'di questo comportamento qui: https://blog.angularindepth.com/everything-you-need-to-know-about-the-expressionchangedafterithasbeencheckederror-error-e3fd9ce7dbb4

ma ancora non capisco perché questo problema si verifica specificamente con un Osservabile, ma non è una promessa.

risposte:

view.component.ts

ngOnInit() {
this.translationService.get("VIEW.title").subscribe(pageTitle =>
setTimeout(() => {
this.titleService.setPageTitle(pageTitle);
}, 0);
);
}