html - 当我使用异步管道时 *ngFor 和 *ngForOf 不起作用
问题描述
我尝试将所有内容更改为或仅更改 *ngFor 并且它不起作用它表明该问题
我正在使用 NGRX Observable 并且值在 STORE 开发工具上显示给我,但在我的组件上不是
我该如何解决这个问题?
<ul>
<li *ngFor="let swimsuit of swimsuits$ | async">
<div *ngForOf="let swimsuitItem of swimsuit">
{{swimsuitItem.shirt}}
{{swimsuitItem.pants}}
{{swimsuitItem.lower}}
</div>
</li>
</ul>
错误
NG0303: Can't bind to 'ngForOfOf' since it isn't a known property of 'div'.
解决方案
[NgForOf]
是内部使用的指令*ngFor
<ng-template ngFor let-item [ngForOf]="swimsuits$ | async">
<li>...</li>
</ng-template>
类似于:
<li *ngFor="let swimsuit of swimsuits$ | async">...</li>
在不知道您的数据结构的情况下,我假设可以简单地执行以下操作:
<ul>
<li *ngFor="let swimsuit of swimsuits$ | async">
{{swimsuit.shirt}}
{{swimsuit.pants}}
{{swimsuit.lower}}
</li>
</ul>
如果您在问题中添加示例 JSON 模型,我很乐意更新我的答案以进一步帮助您。
推荐阅读
- javascript - 将 sigma.js v2 与 node.js 一起使用
- python - 如何通过使用python逐个替换每个单词来获得新句子?
- python - 打开 HTML 文件并将其保存为字符串变量的最简单方法
- asp.net-mvc - Sitecore - Application Insights 遥测 - 自定义属性
- vue.js - Nuxt 上的 Highcharts 未定义窗口
- javascript - 如何在 vue 测试工具中模拟 @click="openModal($index)"
- firebase - 从 Firestore Flutter 中删除文档及其子集合
- javascript - 遇到 TypeError:无法读取 Discord.JS 中未定义的属性“0”
- node.js - 如何绕过 Zeplin API 速率限制错误
- javascript - Google Sheet 的正确格式和命令 - Json 馈送数据表