ExpressionChangedAfterItHasBeenCheckedError для Angular таблицы в итоговом нижнем колонтитуле

Question

Кажется, я получаю ошибку ExpressionChangedAfterItHasBeenCheckedError. Я скопировал свой код в stackblitz, и я вижу (Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'null: Liquidated Damages'. Current value: 'null: undefined') в журнале консоли для 2 моих функций, но я не уверен, как go исправить их, поскольку они технически работают, но это также заставляет таблицу вести себя странно если это имеет смысл?

Проблема с моими двумя функциями.

getFooterTotal(key:any) {
    return this.TRANSACTIONS_DATA.map(t => t[key]).reduce((acc, value) => acc + value, 0);
}

getRowTotal(index: number) {  
  delete this.TRANSACTIONS_DATA[index]['total'];
  delete this.TRANSACTIONS_DATA[index]['item'];
  const data = this.TRANSACTIONS_DATA
  let initValue = 0;

    for(const key in data[index]) {
      initValue += (+data[index][key]);
    }
 
    this.grandTotal += initValue;
    return initValue;
}

https://stackblitz.com/edit/angular-9ydmcq

Есть предложения?