[英]How render data from array in ng-container Angular 2?
I want to render data from array into HTML table. 我想将数据从数组呈现到HTML表中。 Here's my model: 这是我的模型:
export class Section {
public id :number;
public name: string;
constructor(id: number, theName: string) {
this.id = id;
this.name = theName;
}
}
I import it and fill it in the component: 我将其导入并填写到组件中:
import { Section } from "../models/registerSection.model";
Array declaration: 数组声明:
sectionList: Array<Section>;
Array is filled in constructor: 数组填充在构造函数中:
this.sectionList = [new Section(1, "A"),
new Section(2, "B*"),
new Section(3, "C"),
new Section(4, "D")];
This is how I'm trying to render data in template: 这就是我试图在模板中呈现数据的方式:
<ng-container *ngFor='let data of Section'>
<tr>
<td colspan="7">{{data.name}}</td>
</tr>
</ng-container>
But the table is empty. 但是表是空的。 In DOM, I see the following: 在DOM中,我看到以下内容:
<!--template bindings={
"ng-reflect-ng-for-of": null
}-->
What am I doing wrong? 我究竟做错了什么? In debugging I can see that array contains data. 在调试中,我可以看到该数组包含数据。
It should be: 它应该是:
<ng-container *ngFor='let data of sectionList'>
Right now, you are trying to iterate through Section
model, not sectionList
which is instance of that model. 现在,您正在尝试遍历Section
模型,而不是sectionList
该模型实例的sectionList
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.