[英]*ngFor on ng-template outputs nothing Angular2
Not sure why my *ngFor loop is printing nothing out.不知道为什么我的 *ngFor 循环没有打印任何内容。 I have the following code in an html file:
我在 html 文件中有以下代码:
<table class="table table-hover">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Company</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<!-- NGFOR ATTEMPTED HERE -- no content printed -->
<ng-template *ngFor="let xb of tempData">
<tr data-toggle="collapse" data-target="#demo1" class="accordion-toggle">
<td>{{ xb.name }}</td>
<td>{{ xb.email }}</td>
<td>{{ xb.company }}</td>
<td>{{ xb.status }}</td>
</tr>
<!-- other content -->
</ng-template>
</tbody>
</table>
Then, in my simple component I have the following:然后,在我的简单组件中,我有以下内容:
import { Component } from '@angular/core';
@Component({
selector: 'my-profile-exhibitors',
templateUrl: './profile-exhibitors.component.html',
styleUrls: ['./profile-exhibitors.component.scss']
})
export class ProfileExhibitorsComponent {
public tempData: any = [
{
'name': 'name1',
'email': 'email1@gmail',
'company': 'company',
'status': 'Complete'
},
{
'name': 'name2',
'email': 'email2@gmail',
'company': 'company',
'status': 'Incomplete'
}
];
constructor() {}
}
When I run this code, I get zero output.当我运行此代码时,我得到零输出。 Even weirder is that when I select the element using debug tools I see this:
更奇怪的是,当我使用调试工具选择元素时,我看到了:
Looks like it correctly recognizes my object, but then outputs nothing.看起来它正确识别了我的对象,但随后什么也没输出。
I think what you want is我想你想要的是
<ng-container *ngFor="let xb of tempData">
or或者
<ng-template ngFor let-xb [ngForOf]="tempData">
获取索引: <ng-template ngFor let-xb [ngForOf]="tempData" let-index="index">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.