*ngFor 和 *ngForOf 在我使用异步管道时不起作用

Question

我尝试将所有内容更改为 in 或仅更改 *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'.

我使用那个文档 https://angular.io/api/common/NgForOf

Answer 1

[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 模型，我很乐意更新我的答案以进一步帮助您。