Angular HTML循环，深拷贝，数据更新视图不更新

• ngFor循环对象取值 

data = {};
<div *ngFor="let item of data | keyvalue"></div>    

•  reduce 计算重复累计值

  // Get the total duration
  getCountNumber(dataArr): any{
    return dataArr.reduce((prev, next) => {
      prev[next.eventType] = {
        count: (prev[next.eventType]?.count + 1) || 1,
        status: true,
        show: true
      };
      return prev;
    }, {});
  }

• 深拷贝

  // Deep copy
  deepCopy(oldObj: any): any {
    let newObj = oldObj;
    if (oldObj && typeof oldObj === 'object') {
      if (oldObj instanceof Date) {
        return new Date(oldObj.getTime());
      }
      newObj = Object.prototype.toString.call(oldObj) === '[object Array]' ? [] : {};
      for (const i in oldObj) {
        if (oldObj.hasOwnProperty(i)) {
          newObj[i] = this.deepCopy(oldObj[i]);
        }
      }
    }
    return newObj;
  }

•  数据更新，视图不更新

import {ChangeDetectorRef} from '@angular/core';

constructor(
    private changeDetectorRef: ChangeDetectorRef
) {}

update() {
    this.changeDetectorRef.markForCheck();
    this.changeDetectorRef.detectChanges();
}

关于 Angular 的变化检测，你需要知道的一切