如何获取NGFOR数据在另一个NGFOR -Angular5中获取ID

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>

其中的方法commentofprod(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>

这不是这些指令的火箭科学。它的工作原理与正常情况几乎相同，或者在代码中。因此，第二个示例基本上只是在周期中循环。