ExpressionChangedAfterItHasBeenCheckedError：表达式更改错误但代码有效

Question

我收到下面列出的以下错误。我做了一些研究，人们说要把它放在 ngoninit 或 ngAfterViewInit 中，但这没有用，所以有人可以帮我解决这个问题。相关代码如下。

TrialBalanceComponent.html:29 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'undefined: 374208'. Current value: 'undefined: 748416'.
    at viewDebugError (core.js:7393)
    at expressionChangedAfterItHasBeenCheckedError (core.js:7381)
    at checkBindingNoChanges (core.js:7483)
    at checkNoChangesNodeInline (core.js:10346)
    at checkNoChangesNode (core.js:10333)
    at debugCheckNoChangesNode (core.js:10936)
    at debugCheckRenderNodeFn (core.js:10890)
    at Object.eval [as updateRenderer] (TrialBalanceComponent.html:29)
    at Object.debugUpdateRenderer [as updateRenderer] (core.js:10879)
    at checkNoChangesView (core.js:10234)

HTML代码：

<td>{{totalDebits() | number:'1.2'}}</td>
<td>{{totalcredits() | number:'1.2'}}</td>

ts 代码：

totalDebits() {
    let totalDebit = 0;
    this.accountList.forEach((account) => {
      if (account.accountType === 'debit') {
        this.totalDebitBalance.push(account.accountBalance);
      }
    });

    this.totalDebitBalance.forEach((amount) => {
      totalDebit = totalDebit + amount;
    });

    return totalDebit;
}

  totalcredits() {
    let totalCredit = 0;
    this.accountList.forEach((account) => {
      if (account.accountType !== 'credit') {
        this.totalCreditBalance.push(account.accountBalance);
      }
    });

    this.totalCreditBalance.forEach((amount) => {
      totalCredit = totalCredit + amount;
    });

    return totalCredit;
  }

下面是我在初始化时将代码放在 ng 中，但随后我从 html 调用中得到一个值 0。

<td><b>${{totalDebitAmount | number:'1.2'}} </b></td>
<td><b>${{totalCreditAmount | number:'1.2'}}</b></td>

ts 代码

ngOnInit() {
    this.totalDebits();
    this.totalcredits();
  }

  totalDebits() {
    let totalDebit = 0;
    this.accountList.forEach((account) => {
      if (account.accountType === 'debit') {
        this.totalDebitBalance.push(account.accountBalance);
      }
    });

    this.totalDebitBalance.forEach((amount) => {
      totalDebit = totalDebit + amount;
    });
    this.totalDebitAmount = totalDebit;
    // return totalDebit;
}

  totalcredits() {
    let totalCredit = 0;
    this.accountList.forEach((account) => {
      if (account.accountType !== 'credit') {
        this.totalCreditBalance.push(account.accountBalance);
      }
    });

    this.totalCreditBalance.forEach((amount) => {
      totalCredit = totalCredit + amount;
    });

    this.totalCreditAmount = totalCredit;
    // return totalCredit;
  }

Answer 1

显然删除 totalCreditBalance 列表推送和 totalCreditBalance 列表解决了问题。