devyumao
ExpressionChangedAfterItHasBeenCheckedError
Getting ExpressionChangedAfterItHasBeenCheckedError with:
Angular 4.3.1 Angular2-Busy 2.0.4
Yeah, still seems to work, but the console error is a nag.
Maybe need to use the ChangeDetectorRef to check for changes?
Yeah, maybe try this.ref.markForCheck(); after you set the variable binded to ngBusy. What's weird is the error doesn't show up on my local project, just on my dev server.
After variable binding?
I configure busy in the HTML and set the variable equal to the observable, say when I call an API data service.
My code is like this, I haven't had the chance to check if the error is still showing:
app.component.html
<home-navbar>
</home-navbar>
<simple-notifications></simple-notifications>
<div class="container" [ngBusy]="getBusy()">
<router-outlet>
</router-outlet>
</div>
app.component.ts
import { Component, NgModule, OnInit, ChangeDetectorRef } from '@angular/core';
import { LoadingService } from './services/loading.service';
@NgModule({
declarations: [ AppComponent ],
exports: [ AppComponent ]
})
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
busy: any = [];
constructor(private ref: ChangeDetectorRef,
private loadingHandler: LoadingService) { }
ngOnInit() {
this.loadingHandler.loadingAnnounced$.subscribe(busy => {
this.busy.push(busy);
this.ref.markForCheck(); // <-- Check changes. Use this.ref.detectChanges() if not fixed
});
}
getBusy() {
return [...this.busy];
}
}