在Angular 2中选择PageSize DataTable

Question

My UI

这是我在component.ts中的方法SetPageSize

setPageSize(pages: number) {

let abc = this.showdefaultpage;
abc = 10;

this.inspectorService.getAllData(pages, abc)
  .subscribe(
  data => {
    this.allpagingData = [];
    for (let index in data.inspectors) {
      this.allpagingData.push({
        "id": data.inspectors[index].id,
        "employeeNumber": data.inspectors[index].employeeNumber,
        "name": data.inspectors[index].name,
        "isActive": data.inspectors[index].isActive
      });
    }

    this.totalData = data.totalInspectorViewed;
    this.setPage(pages);
  },
  error => console.log(error));
}

这是我的html to setPageSize数据表

<div style="padding-left: 11px;" class="input-group">
  <span class="input-group-addon">Row: </span>
  <select style="width: 7%" class="form-control" [(ngModel)]="pageSize" name="pageSize" (change)="setPageSize(pages)">
    <option value="5">5</option>
    <option value="10">10</option>
    <option value="15">15</option>
  </select>
</div>

但是在我的方法中只改为10行数据，请帮帮我...如何使方法pageSize可以选择rowsdata到5,10和15. Thankyou

Answer 1

这是我的方法

的答案

setPageSize(pages: number) {

let abc = this.showdefaultpage;

if (abc == 5) {
  this.inspectorService.getAllData(pages, abc)
    .subscribe(
    data => {
      this.allpagingData = [];
      for (let index in data.inspectors) {
        this.allpagingData.push({
          "id": data.inspectors[index].id,
          "employeeNumber": data.inspectors[index].employeeNumber,
          "name": data.inspectors[index].name,
          "isActive": data.inspectors[index].isActive
        });
      }

      this.totalData = data.totalInspectorViewed;
      this.setPage(pages);
    },
    error => console.log(error));
}
else if (abc == 10) {
  this.inspectorService.getAllData(pages, abc)
    .subscribe(
    data => {
      this.allpagingData = [];
      for (let index in data.inspectors) {
        this.allpagingData.push({
          "id": data.inspectors[index].id,
          "employeeNumber": data.inspectors[index].employeeNumber,
          "name": data.inspectors[index].name,
          "isActive": data.inspectors[index].isActive
        });
      }

      this.totalData = data.totalInspectorViewed;
      this.setPage(pages);
    },
    error => console.log(error));
}

else if (abc == 15) {
  this.inspectorService.getAllData(pages, abc)
    .subscribe(
    data => {
      this.allpagingData = [];
      for (let index in data.inspectors) {
        this.allpagingData.push({
          "id": data.inspectors[index].id,
          "employeeNumber": data.inspectors[index].employeeNumber,
          "name": data.inspectors[index].name,
          "isActive": data.inspectors[index].isActive
        });
      }

      this.totalData = data.totalInspectorViewed;
      this.setPage(pages);
    },
    error => console.log(error));
}

}