ExpressionChangedAfterItHasBeenCheckedError报错解决方案

场景：angular7 项目中 同一页面多次引用相同的组件（组件传值 调用方法等完全一样）会出现ExpressionChangedAfterItHasBeenCheckedError报错

我的页面（是一个tab切换，每个tab里都引用了同一时间组件，来回切换就会报错 我使用的是ng-if判断是否加载时间组件）渲染没问题 数据结构层的也已改变 但是控制台会报ExpressionChangedAfterItHasBeenCheckedError错

网上查到的原因如下：

当有很多个异步方式渲染时便会出现标题上所示的错误,造成改错误的原因是angular变更检测后重新更改值可能造成视图和model中的值不统一,所以我们需要手动触发检测

解决方案

import {ChangeDetectorRef } from '@angular/core';

constructor(private cd: ChangeDetectorRef) { }

ishost:any;

fetch() {

    this.ishost = true;

    this.cd.detectChanges(); //变更绑定检测ishost的值

}