Question

我在将值从一个组件发送到另一个组件时遇到问题。我有2个组件：报表和评论表。报告表格有一系列评论。它还显示每个评论列表和按钮。单击按钮后，它应该使用@Input属性commentIndex加载模式窗体。问题是报表格式组件不会仅向评论表单发送（！）数组的第一个值。我不明白为什么：/。

以下是一些代码：

report-form.html的一部分：

 <div class="form-group row">
    <div class="col-md-12 alert alert-dark">Komentarze:</div>
    <div class="col-md-12" *ngFor="let comment of comments">{{ comment.content }}
      <app-comment-form [commentIndex]="comments.indexOf(comment)"></app-comment-form>
    </div>
    <br>
    <app-comment-form></app-comment-form>
  </div>

如果我以注释形式在控制台上记录它，我有3个元素阵列中的1,2个但是0的位置？

Answer 1

您可以直接使用*ngFor提供的索引。

<div class="form-group row">
    <div class="col-md-12 alert alert-dark">Komentarze:</div>
    <div class="col-md-12" *ngFor="let comment of comments; let i = index">{{ comment.content }}
      <app-comment-form [commentIndex]="i"></app-comment-form>
    </div>
    <br>
    <app-comment-form></app-comment-form>
</div>

此index将从0开始。

Angular @Input属性 - 从数组中缺少第一个值

1 个答案: