angular - 当以角度添加新记录时，如何增加每个循环的当前角度索引？

Question

我已将新记录添加到现有表中，此处正在添加记录，但 id 不会自动增加，我编写代码如下所示，我没有发现哪里出错了？如何增加 id 的计数？我是角度新手，如果有人知道解决方案，请帮助我......谢谢

模板 ：

<tbody>
          <tr style="color:dimgrey;" *ngFor="let cmt of lstcomments; let index=i">
            <th scope="row">{{ cmt.id }}</th>
            <td>{{cmt.name}}</td>
            <td>{{cmt.email}}</td>
            <td class="icon-style">           
              <span data-toggle="modal" data-target="#exampleModal"><img src="..\assets\image\trash.png"></span> 
            </td>
          </tr>
        </tbody>

添加记录的弹出窗口：

 <div class="modal fade addNewInputs" id="modalAdd" tabindex="-1" role="dialog" aria-labelledby="modalAdd"
        aria-hidden="true">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header text-center">
              <h4 class="modal-title w-100 font-weight-bold text-primary ml-5">Add new user</h4>
              <button type="button" class="close text-primary" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body mx-3">
             <div class="md-form mb-5">
                <label data-error="wrong" data-success="right" for="inputName">Name</label>
                <input type="text" id="inputName" class="form-control validate" id="newAttributeName" [(ngModel)]="newAttribute.name" name="newAttributeName">               
              </div>         
              <div class="md-form mb-5">
                <label data-error="wrong" data-success="right" for="inputemail">Email</label>
                <input type="text" id="inputSalary" class="form-control validate" id="newAttributeEmail" [(ngModel)]="newAttribute.email" name="newAttributeEmail" >                
              </div>  
            </div>
            <div class="modal-footer d-flex justify-content-center buttonAddFormWrapper">
              <button (click)="addNewuser()" class="btn btn-outline-primary btn-block buttonAdd" data-dismiss="modal">Add form              
              </button>
            </div>
          </div>
        </div>
      </div> 
      <div class="float-right">
        <a href="" class="btn btn-info btn-rounded btn-sm " data-toggle="modal" data-target="#modalAdd"><i class="fa fa-plus" ></i>Add</a>
      </div>

ts：

 addNewuser() {
      this.lstcomments.push(this.newAttribute);
      this.newAttribute = {};
  }

标签： angular

Answer 1

尝试为 id 添加一个键并在推送之前将值添加到键中

addNewuser() {
      this.newAttribute.id=this.lstcomments.count++;
      this.lstcomments.push(this.newAttribute);
      this.newAttribute = {};
  }

这可能对你有帮助