I'm using a css loader on my root app.component.html with a ngIf :
<div *ngIf="displayPageLoader" class="page-loader-background">
<div class="page-loader">
<div class="loader2" style="font-size: 7px; top: -50px;">Loading...</div>
</div>
</div>
When i need to display the loader, i'm calling the ToggleLoadersService service which tells the root component to change the variable displayPageLoader.
It works well but i keep getting this error on pretty much every page :
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'true'. Current value: 'false'.
at viewDebugError (vendor.bundle.js:8687)
at expressionChangedAfterItHasBeenCheckedError (vendor.bundle.js:8665)
at checkBindingNoChanges (vendor.bundle.js:8829)
at checkNoChangesNodeInline (vendor.bundle.js:12682)
at checkNoChangesNode (vendor.bundle.js:12656)
at debugCheckNoChangesNode (vendor.bundle.js:13431)
at debugCheckDirectivesFn (vendor.bundle.js:13333)
at Object.eval [as updateDirectives] (ng:///AppModule/AppComponent.ngfactory.js:50)
at Object.debugUpdateDirectives [as updateDirectives] (vendor.bundle.js:13315)
at checkNoChangesView (vendor.bundle.js:12476)
at callViewAction (vendor.bundle.js:12840)
Here's a scenario that toggles this error :
The error appears when the page 2 try to call the ToggleLoadersService service to toggle off the loader.
I am aware that there are other related subjects but they are not really helping me.
Any help would be appreciated. Thanks.
Try [hidden] as it only hide the element not remove it. it will not create an event but will be only available to UI
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.