Question

我们有一个datatable的角。所有元素都有一个删除按钮。当我们按下此按钮时，调用Web服务并将其删除。 HTML代码类似于：

 <table datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger" class="table table-hover table-bordered table-striped">
                    <thead>
                      <tr>
                        <th>User</th>
                        <th>{{'action' | translate}}</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr *ngFor="let user of users">
                        <td>{{user.user}}</td>
    <td>         <a title="{{'delete' | translate}}" (click)="delete(user)"><i
                          class="fas fa-trash"></i></a> </td>
                      </tr>
                    </tbody>
                  </table>

与TS文件类似。

  ngOnInit(): void {
    AdminLTE.init();
    this.dtOptions = {
      pagingType: "full_numbers",
      pageLength: 10,
      sScrollX: "100%",
      responsive: true,
      processing: true,
      searching: true,
      destroy:true,
      }
    };

    this.usersCtrl.getUsers().subscribe(
      response => {
        this.users = response["body"];
        this.dtTrigger.next();
      },
      error => {
        console.log(error);
      }
    );
  }

  ngOnDestroy(): void {
    this.dtTrigger.unsubscribe();
  }

所以问题是：当用户删除此元素之一时，如何重绘数据表？我知道我可以使用window.location.reload，但我搜索的方式更优雅。

Answer 1

我只是调用该函数以在删除后再次获取用户，以获取最新用户，所以：

Nz(Choose(BN_CS_MP_MASTERPROFILE.CMP_SALUTATION,'Mr','Mme','Mlle'),'ND')

我在这里使用import { switchMap } from 'rxjs/operators'; // ... deleteUser() { // replace delete function with your actual function this.usersCtrl.deleteUser().pipe( switchMap(() => this.usersCtrl.getUsers()) ) // below is your getUsers response .subscribe(response => { ... }) }来链接请求。

Angular-删除元素时重绘表格

1 个答案: