网站搜索

javascript - 模板中 *ngIf 的变化未被检测到


我正在尝试显示加载状态 3 秒,然后使用 *ngIf 将其隐藏。我使用的是 Angular 8。在我以前的项目中我没有遇到这个问题。

这是我的代码..

//Component.ts
loading = true;
ngOnInit() { 
   setTimeout(()=> {
     this.loading = false;
     console.log(this.loading)
   },3000)
}

//Component.html
<div *ngIf="loading" class="col-lg-12" style="text-align: center;">
     <app-loading></app-loading>
</div>

加载在3秒后变为 false,但模板中没有检测到变化。我可以知道原因吗?有什么建议可以在不使用 ChangeDetectorRef 的情况下解决吗?

答案#1

该示例应该可以工作,除非您使用 OnPush 变更检测策略:

答案#2

像这样试试:

演示示范

ngOnInit() {
  let that = this;
  setTimeout(() => {
    that.loading = false;
    console.log(that.loading);
  }, 3000);
}