angular - ExpressionChangedAfterItHasBeenCheckedError 的原因“检查后表达式已更改”

Question

我检查了一些文件，但在我的情况下我无法理解这个错误的原因。虽然它看起来很棒的文章： https ://blog.angular-university.io/angular-debugging/ ，但我无法理解。

让我详细介绍一下代码。

.html

<mat-tab-group>


    <mat-tab label="My Cards">
      <div class="cardList">
        <ng-container *ngFor="let card of myCards; let i=index">
          <app-card [cardItem]="card" 
                     class="cardListItem"></app-card>
        </ng-container>
      </div>
    </mat-tab>

    <mat-tab label="Winning Cards">
      <div class="cardList">
        <ng-container *ngFor="let winningCard of winningCards; let i=index">
          <app-card [cardItem]="winningCard" 
                     class="cardListItem"></app-card>
        </ng-container>
      </div>
    </mat-tab>

</mat-tab-group>

对于以下代码， 在使用前somefunction()调用ngOnInit()并this.myCards已满

.ts（格式 1）

//fill myCards and winningCards

somefunction
{  ..........
   this.winningCards= [...this.myCards];
}

收到错误“检查后表达式已更改”

.ts（格式 2）

//fill myCards and winningCards

somefunction
{   ..........
    const myClonedArray: CardModel[] = Object.assign([], this.myCards);
    this.winningCards = myClonedArray;
}

收到错误“检查后表达式已更改”

.ts（格式 3）

//fill myCards and winningCards
somefunction
{       ..........
        this.winningCards = JSON.parse(JSON.stringify(this.myCards));
}

我没有收到错误，工作正常

因此，如果您考虑此代码，为什么在我使用时发生此错误 [...this.myCards];或 在使用Object.assign([], this.myCards);时未发生 此错误this.winningCards = JSON.parse(JSON.stringify(this.usedCards));

标签： angularangular6angular5