Question

我的模板中有一个有趣的设置，它使用数组中的值来计算和显示数字

{{moduleProps.totals | values | sum | currency:'USD':true:'1.0-0'}}

这是值管道

import { Pipe, PipeTransform } from '@angular/core';
import { values } from 'lodash';

@Pipe({
  name: 'values',
})
export class ValuesPipe implements PipeTransform {
  transform(value: any, ...args) {
    if(value){
      return values(value);
    }
  }
}

这是总和管道

import { Pipe, PipeTransform } from '@angular/core';
import { reduce } from 'lodash';

@Pipe({
  name: 'sum',
})
export class SumPipe implements PipeTransform {
  transform(value: any, ...args) {
    if(value){
      return reduce(value,(a,b)=>a+b,0);
    }
  }
}

我正在使用的数组看起来像这样......

[donation_earnings: 868, donation_pledges: 10, raffle_purchase_earnings: 4, fixed_purchase_earnings: 6, bid_earnings: 38]

当我尝试稍后更新这些数字时，就像这样......

this.moduleProps.totals.donation_pledges + = events [0] .amount;

events[0].amount应该是一个数字，添加到该对象属性的当前数量。

但是，当我这样做时，模板不会更新。当我在进行数学运算后退出对象属性时，我看到数字已更改，但模板没有听到它。

我这样做后，我也在打电话

this.changeDetectorRef.detectChanges（）;

帮助对正在推送和弹出的另一个项目数组进行更改检测，但这似乎也没有获取对数组中值的更改。

我也尝试在NgZone.run()中运行此功能，但也没有更新模板。

对于角度2处理阵列变化检测的方式，我还不了解某些警告吗？

修改

此外，当我将单个对象属性输出到页面时，我看到它们的数字发生了变化，它只是通过未更新的管道传递的数字

当数组中的元素发生更改时，模板不会更新

0 个答案: