Angular 2+ ExpressionChangedAfterItHasBeenCheckedError：表达式在检查后已更改

Question

我的应用具有亲子关系。在父级中，我包括以下子级选择器：

<app-chip-list [ocoChipItems]="getChipItems(row['status'])"></app-chip-list>

请注意，传递给子级的数据必须通过父级的getChipItems（）方法中的逻辑得出。

虽然该应用程序似乎可以正常运行，但它在控制台中抛出“ ExpressionChangedAfterItHasBeenCheckedError：表达式在检查后已更改”。

我通过在父组件的声明中添加以下内容来解决此问题：

changeDetection: ChangeDetectionStrategy.OnPush

我不完全了解它的作用。因此，我不确定这是否是合适的解决方案。

感谢您的反馈。

Answer 1

在我的应用程序中加载表格时，将在单元格上调用一个函数以确定其值。这导致值从null更改为其他值，从而导致问题。因此，我强制从表中加载数据后进行更改检测。这是通过预订表的数据源上的属性来完成的，该属性在表中加载数据后会发出事件。

this.dataSource.loading$.subscribe(() => {
  this.cdr.detectChanges();
});

我将此代码添加到ngOnInit（）方法的末尾。