我如何做Angular ngFor迭代？
我如何做Angular ngFor迭代？
提问于 2018-10-23 06:48:53
任何人都可以帮助我如何在模板中填充以下json数据。这是我的代码：
app.html
<div *ngFor="let item of dataSource">
Key: <b>{{item.referenceID}}</b> and Value: <b>{{item.merchantID}}</b>
</div>
app.ts
dataSource: MatTableDataSource<MerchantFinanceElement>;
this.abstractRestService.get('finance').subscribe(
(response: any) => {
const merchantFinanceData: MerchantFinanceElement[] = response;
this.dataSource = new MatTableDataSource(merchantFinanceData);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
console.log('this.dataSource', this.dataSource.data);
},
(error: any) => {
console.log(error);
}
);
回答 2
Stack Overflow用户
发布于 2018-10-23 15:04:37
只需添加filtredData即可
<div *ngFor="let item of dataSource.filtredData |async">
Key: <b>{{item.referenceID}}</b> and Value: <b>{{item.merchantID}}</b>
</div>
Stack Overflow用户
发布于 2018-10-23 16:30:15
keyvalue从html中删除并迭代merchantFinanceData哪个是数组。
它应该是 -
<div *ngFor="let item of merchantFinanceData">
Key: <b>{{item.referenceID}}</b> and Value: <b>{{item.merchantID}}</b>
</div>
TS
merchantFinanceData: MerchantFinanceElement = [];
this.abstractRestService.get('finance').subscribe(
(response: any) => {
this.merchantFinanceData = response;
this.dataSource = new MatTableDataSource(merchantFinanceData);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
console.log('this.dataSource', this.dataSource.data);
},
(error: any) => {
console.log(error);
}
);
注意：此答案与您的问题相对应，该问题
*ngFor与Angular Material 无关。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100002970
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号