大佬教程收集整理的这篇文章主要介绍了angular – 使用2种不同的* ngFor填充表格,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
{ "tagFrequency": [ { "value": "aenean","count": 1,"tagId": 251 },{ "value": "At","tagId": 249 },{ "value": "faucibus",{ "value": "ipsum",{ "value": "lobortis","tagId": 194 },{ "value": "molestie",{ "value": "unde tempor,interdum ut orci metus vel morbi lorem. Et arcu sed wisi urna sit egestas fringilla,at erat. Dolor nunc.","tagId": 199 },{ "value": "Vestibulum","tagId": 251 } ] }
我想显示这些属性即.表中的value,count和tagName(使用tagId获取).对于我使用NgFor的前两个属性.但是,我想打印tagName,我正在使用tagId并将其存储在tagNames数组中.以下是我的组件代码:
frequencies: any; tagNames: String[] = []; ngOnInit() { if (this.route.snapshot.url[0].path === 'tag-frequency') { let topicId = +this.route.snapshot.params['id']; this.tagservice.getTagFrequency(topicId) .then( (response: any) => { this.frequencies = response.json().tagFrequency for(let tagFrequency of this.frequencies) { this.getTagName(tagFrequency.tagId) } } ) .catch( (error: any) => console.error(error) ) } } getTagName(tagId: number): String { return this.tagservice.getTag(tagId) .then( (response: any) => { this.tagNames.push(response.Name) } ) .catch( (error: any) => { console.error(error) } ) }
这就是我试图在UI上打印它们的方式:
<table> <thead> <tr> <th>{{ 'word' }}</th> <th>{{ 'tag-name' }}</th> <th>{{ 'frequency' }}</th> <th></th> </tr> </thead> <tbody> <ng-container *ngFor="let name of tagNames"> <tr *ngFor="let frequency of frequencies; let i=index"> <td>{{ frequency.value }}</td> <td>{{ name }}</td> <td>{{ frequency.count }}</td> </tr> </ng-container> </tbody> </table>
但我在列标签名下获得了[对象对象].有人可以帮我解决这个问题吗?
我尝试使用如上所述的ng-container,但结果在UI上看起来像这样:
哪个错了.我只需要前3行,标记名称分别为“Subtag 3”,“Zeit1”,“Tag 1”,分别为1,2,3行.
提前致谢.
以上是大佬教程为你收集整理的angular – 使用2种不同的* ngFor填充表格全部内容,希望文章能够帮你解决angular – 使用2种不同的* ngFor填充表格所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。