如何循环包含单元格表中对象数组的单元格对象 [英] How to loop mat-cell object which contains array of objects in mat table

问题描述

我已经将对象数组传递给了mat表中的dataSource内部对象数组.我无法遍历具有对象数组的对象.

I have passed array of objects which inside having array of objects to dataSource in mat table. I am unable to loop through the object which has array of objects.

    const roleListData = [
  {
    roleId: 1,
    role: "admin",
    description: "Testing",
    level: "1",
    roleFunctions: [
      {
        createdBy: "person-1",
        createdOn: "2019-11-04T20:02:52.345",
        updatedBy: null,
        updatedOn: null,
        segmentId: 2,
        segmentType: "Dealer",
        segmentName: "testing",
        segmentValue: "5",
        additionalInfo: null,
        active: true
      }
    ]
}
]

roleFunctions的表格单元格:

Table cell for roleFunctions:

<ng-container matColumnDef="roleFunctions">
          <th mat-header-cell *matHeaderCellDef mat-sort-header>Functions</th>
          <td mat-cell *matCellDef="let row">
            {{ item }}
          </td>
        </ng-container>

我需要访问具有内部对象数组的roleFunction对象.如果该数组没有任何对象，那么它也可以正常工作而不会出现任何问题.因为根据我的要求，对象可能包含也可能不包含对象数组.如果存在它们，那么我应该能够在该表cel中显示内部对象信息.

I need to get access to roleFunction object which intern have array of objects. if that array does not have any objects then also it should work fine without any issues. because as per my requirement that object may or may not contain array of objects. if they are present then i should be able to display inside object information in that table cel.

推荐答案

如果我正确理解，则需要执行此操作才能访问表中的roleFunctions属性.

If I understand correctly, you need to do like this to access the roleFunctions attribute inside the table.

<ng-container matColumnDef="roleFunctions">
  <th mat-header-cell *matHeaderCellDef mat-sort-header>Functions</th>
  <td mat-cell *matCellDef="let row">
    {{ row.roleFunctions }}
  </td>
</ng-container>

如果要显示所有roleFunction，可以执行以下操作:

If you want to show all the roleFunctions, you can do:

<ng-container matColumnDef="roleFunctions">
  <th mat-header-cell *matHeaderCellDef mat-sort-header>Functions</th>
  <td mat-cell *matCellDef="let row">
    <span *ngFor="let funct of row.roleFunctions">{{func.segmentName}}</span>
  </td>
</ng-container>

这篇关于如何循环包含单元格表中对象数组的单元格对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！