我想获取点击用户的ID，并在引导模态上点击“是”时将其删除

Question

这是html文件，我想单击特定学生的ID，然后使用弹出模式删除学生

<div style="margin-top: 50px;">
    <table  datatable="ng" class="row-border hover" [dtOptions]="dtOptions" [dtTrigger]="dtTrigger">
      <thead>
        <tr>
          <th>S/N</th>
          <th>Full Name</th>
          <th>Class</th>
          <th>Sex</th>
          <th>Edit</th>
          <th>Delete</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let student of students; let i = index">
          <td>{{i+1}}</td>
          <td><a [routerLink]="['/view-student', student.id]" >{{student.lastName  +  '   '  +   student.firstName}}</a></td>
          <td>{{student.grade.name}}</td>
          <td>{{student.sex.name}}</td>
          <td><a [routerLink]="['/edit-student', student.id]" class="btn btn-primary" >Edit</a></td>
          <td><a  data-toggle="modal" data-target="#myModal" class="btn btn-danger">Delete</a></td>
        </tr>
       
      </tbody>
    </table>
    
    </div>


<!-- Modal -->
<div class="modal fade"  id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Warning</h4>
      </div>
      <div class="modal-body">
        Are you sure you want to delete..
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
        <button type="button" (click)="" data-dismiss="modal" class="btn btn-primary">Yes</button>
      </div>
    </div>
  </div>
</div>

这是我在组件中具有的删除功能，用于删除我单击的学生。谢谢您的提前帮助

delete(id){
this.studentService.delete(id).subscribe(() => {
  this.students.splice(id, 1);
this.loadAllStudents();
});}

Answer 1

只需在组件属性中保存当前的学生ID。

html（表格）：

...
<td><a (click)="setId(student.id)" data-toggle="modal" data-target="#myModal" class="btn btn-danger">Delete</a></td>
...

ts：

public id = ''

setId(id) {
  this.id = id
}

html（modal）：

...
<button type="button" (click)="delete(id)" data-dismiss="modal" class="btn btn-primary">Yes</button>
...