Question

我有一个带id的对象数组，我需要在其他数组中传递这个id;例如：

    product = [
      { id: 1, name: teste }, { id: 2, name: teste 2 }
    ]

    comment = [
      {product_id: 1, comment: lorem ipsum }
    ]

我需要一个ngFor来接收产品和评论

<div *ngFor="let prod of product">
 {{prod.name}}
 <div class="comments">
 /* i need pass comment object from product_id == prod.id /*
 how do I do that?
 </div>
</div>

Answer 1

<div *ngFor="let prod of product">
  <div *ngFor="let c of comment">
    <span *ngIf="c.product_id === prod.id">{{ c.comment }}</span>
  </div>
</div>

会工作（效率低下）。在您需要再次执行此操作时，将comment加入服务中的product模型或类似模型会更好。

Answer 2

我相信：

<div *ngFor="let prod of product">
  {{prod.name}}
  <div class="comments">
    <div *ngFor="let comment of commentsOfProd(prod.id);">
       {{ comment.comment }}
    </div>
  </div>
</div>

where methodOfProd（id）将返回产品的过滤注释数组。

或者只是在模板中更简单：

<div *ngFor="let prod of product">
 {{prod.name}}
  <div class="comments">
    <div *ngFor="let comment of comments">
       <div *ngIf="comment.product_id == prod.id">
         {{comment.comment}}
       </div>
     </div>
   </div>
 </div>

这不是具有这些指令的火箭科学。它与代码中的正常For或If几乎相同。所以第二个例子基本上只是循环中的一个条件。

如何获取ngFor数据获取另一个ngFor - Angular5中的id

2 个答案: