TypeError：无法读取Angular 8中未定义的属性“ reduce”

debugcn 发表于 Dev

关税

我有一个在表上填充数据的api，正在尝试计算所有列中所有值的值，面临的挑战是，列中同时包含字符串和数字，正在使用一个reducer来获取数字和字符串，并将它们简化为一个总和。我最终得到一个错误：

错误TypeError：无法读取AgedisplacementComponent.getSum上未定义的属性“ reduce”

到目前为止我做了什么

export class AgeDisplacement {
  constructor(
    public num1 : string,
    public num2: number,
    public num3: number,
    public num4: number,
    public num5: number,
  ) {
  }
}
    export class AgedisplacementmenComponent implements OnInit {
      agemen: AgeDisplacement[];
      private api = ServiceConstants.apiUrl + '/api/v1/agedisplacement/goods';
    
      constructor(private httpClient: HttpClient,
                  private modalService: ModalService,
                  private service: ReportService) {
      }

    getSum(index: number) : number{
    
        let sum = 0;
          for(let i = 0; i < this.agemen.length; i++) {
            sum = this.agemen[i][index].reduce((accumulator, currentValue) => {
              return accumulator + (!isNaN(Number(currentValue)) ? 0 : Number(currentValue));
            });
            console.log("data is " + sum);
          }
          return sum;
      }

this.agemen保留的样本数据

{
        "id": 22,
        "teamNumber": "Group 1",
        "sex": 1,
        "age12": 0,
        "age13": 0,
        "age14": 0,
        "age15": 0,
        "age16": 0,
        "age17": 1,
        "age18": 0,
        "noofwomen": 1,
        "ageratio": " DEFAULT",
        "targetnotmet": " DEFAULT"
    },
    {
        "id": 23,
        "teamNumber": "Group 2",
        "sex": 1,
        "age12": 0,
        "age13": 0,
        "age14": 0,
        "age15": 1,
        "age16": 0,
        "age17": 0,
        "age18": 1,
        "noofwomen": 2,
        "ageratio": 34,
        "targetnotmet": 45
    },
    {
        "id": 24,
        "teamNumber": "Group 3",
        "sex": 1,
        "age12": 0,
        "age13": 0,
        "age14": 0,
        "age15": 0,
        "age16": 0,
        "age17": 0,
        "age18": 0,
        "noofwomen": 0,
        "ageratio": " DEFAULT",
        "targetnotmet": " DEFAULT",
    },

我需要如何汇总下面的所有列：

<tr *ngFor="let item of items">
     <td>{{item.num1 }}</td>
     <td>{{item.num2}}</td>
     <td>{{item.num3}}</td>
     <td>{{item.num4}}</td>
     <td>{{item.num5}}</td>
</tr>
<tr>
     <td>SUM1</td>
     <td>SUM2</td>
     <td>SUM3</td>
     <td>SUM4</td>
     <td>SUM5</td>
</tr>

我究竟做错了什么？先感谢您

基兰

由于您的数据是一个对象数组，因此遍历此对象，您将获得一个Object，该对象将没有index通过进行访问的任何属性this.agemen[i][index]。index传递getSum给您的东西不会真正给您您想要的。你想要的是一个propertyName可能是你想获得即财产，你的列显示例如其总和属性：'age12'，'age13'等不是传递一个的propertyName，你也可以保持你自己的地图，其中列索引持有该物业。例如：

const columnNumberToPropertyMap = Object.freeze({
    0: 'id',
    1: 'age12', // assuming you display `age12` property's value on 2nd column
    2: 'age13',
    3: 'age14'
    // ... and so on.
});

因此，根据您使用的是地图还是将传递给propertyName，getSum您可以将函数更改为以下形式：

getSum(columnNumber: number) : number {
    return this.agemen.reduce((acc, curr) => {
        const property = columnNumberToPropertyMap[columnNumber]; // If you pass `property` directly to function, you don't need this lin
        const adder = isNaN(Number(curr[property])) ? 0 : Number(curr[property]); // you are doing just the opposite here

        return acc + adder;
    }, 0);
}

// Now wherever you want to get the sum of a column, for eg: 2nd column which holds the value of `age12` property, you can do:
getSum(1);

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。