ngx-datatable-返回空表(角度6)

时间:2018-11-20 23:06:04

标签: angular angular6 ngx-datatable

我正在尝试通过API响应(异步功能)填充ngx-datatable。我设法使函数正常工作,但是表中的行为空白(创建了正确的行数)。

Empty Table

当我将鼠标悬停在桌子上时,它会按预期触发onActivate函数记录事件,当我查看事件数据时,我可以看到要在桌子上显示的数据。这表明数据已正确传递到表,但问题是由于排序的渲染问题引起的。

HTML:

<div class="row">
    <div class="col-sm-12">
        <ngx-datatable class="bootstrap selection-cell"
          [rows]="rows"
          [columnMode]="'force'"
          [columns]="columns"
          [headerHeight]="50"
          [footerHeight]="50"
          [rowHeight]="'auto'"
          [limit]="20"
          [selected]="selected"
          [selectionType]="'multiClick'"
          (activate)="onActivate($event)"
          (select)='onSelect($event)'>
        </ngx-datatable>
    </div>
</div>

组件:

res_out = {}
  res_out_ = []
  rows = []
  loadingIndicator = true;
  reorderable = true;
  selected = [];

  columns = [
    { name: 'ID'},
    { name: 'FileID'},
    { name: 'SectionNum'}
  ];

  constructor() {

      this.fetchData((dt) => {
        this.rows = dt;
        setTimeout(() => { this.loadingIndicator = false; }, 1500);
      });

    };


  async fetchData(cb) {
    return await API.get(this.apiName, this.path, this.myInit).then(response => {
      response.forEach(element => {
        this.columns.forEach((el, i) => this.res_out[el.name] = element[i]);
        this.res_out_.push(this.res_out)
      });
      console.log(this.res_out_)
       cb(this.res_out_)
    }).catch(error => {
      this.res_out_ = [this.res_out]
      console.log(error.response)

    });
  }

我尝试通过Observable填充数据,并且异步管道仍然无法正常工作。

有什么想法吗?

1 个答案:

答案 0 :(得分:-1)

将“prop”定义添加到您的列定义以绑定到属性