ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.

解决方案：

异步更新（建议使用）
强制进行变更检测，但是会触发子组件的变更检测，再次导致父组件属性改变

Parent.Component.ts

@Component({

    selector:"app-parent"

})

export class ParentComponent implements OnInit,AfterViewInit {

    public text = "给子组件的信息";

    constructor(private cdr: ChangeDetectorRef){}

    ngOnInit(){}

    // 该方法缺点： 子组件多的情况下，不易控制。不建议使用

    ngAfterViewInit(){

        this.cdr.detectChanges();

    }

}

Child.Component.ts

@Component({

    selector:"app-child"

})

export class ChildComponent implements OnInit, AfterViewInit {

    @Input text;

    constructor(private parentComponent: ParentComponent){}

    ngOnInit(){}

    ngAfterViewInit() {

        // 异步更新两种方式

        // 第一种

        setTimeout( ()=>{

            this.parentComponent.text="update message"

        },2000);

        // 第二种

        Promise.resolve(null).then( ()=> {this.parentComponent.text="update message"});

    }

}

参考原文：https://blog.csdn.net/friend_ship/article/details/81773057

巴特西

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.

解决方案：

Parent.Component.ts

Child.Component.ts

最新文章

热门文章