Javascript Angular-用于具有数组属性的对象的集合

我有一门课是这样的：

export class TableColumn {
  columnName: string;
  isToFilter: boolean;
  isToSort: boolean;
  isLink: boolean;
  linkUrl: string;
  columnData: any[];

constructor(
    columnName: string,
    isToFilter: boolean,
    isToSort: boolean,
    isLink: boolean,
    linkUrl: string,
    columnData: any[]) {
    this.columnName = columnName;
    this.isToFilter = isToFilter;
    this.isToSort = isToSort;
    this.isLink = isLink;
    this.linkUrl = linkUrl;
    this.columnData = columnData;
  }
}

您可以看到这里有一个数组属性-

columnData

。我的问题是，当我使用

*ngFor

指令迭代此类实例数组时，如下所示：

 ngFor="let column of tableColumns" 

该指令不仅遍历

tableColumns

的内容，而且遍历每个实例中

columnData

属性的内容

---

我想知道如何不遍历属性

columnData

的内容，你是说你有一个

TableColumn

对象的数组，你想循环这些对象，然后在每个对象内部也循环

columnData

数组

首先，正如您所知，您可以这样编写类对象来简化事情。它可以编译成完全相同的JavaScript

在我们的控制器中有一些这样的示例数据：

public tableColumnList = [
  new TableColumn('one', true, true, true, 'google.com', [1,2,3]),
  new TableColumn('two', true, true, true, 'google.com', [4,5,6, 7, 8]),
  new TableColumn('three', true, true, true, 'google.com', [9, 10, 11])
];

您可以使用嵌套的

*ngFor

指令，如下所示

<div *ngFor="let tc of tableColumnList">
  <h4>{{tc.name}}</h4>
  <ul>
    <li *ngFor="let data of tc.columnData">
      {{data}}
    </li>
  </ul>
</div>

{{tc.name}


{{data}}

你能分享你的模板片段吗？{{column}@bambaniasz您想说，

column

变量从每个

tableColumn

的

ColumnData

获取值，当我像这样使用它时，它可以迭代ColumnData属性。tableColumns是TableColumn对象的数组。

<div *ngFor="let tc of tableColumnList">
  <h4>{{tc.name}}</h4>
  <ul>
    <li *ngFor="let data of tc.columnData">
      {{data}}
    </li>
  </ul>
</div>