问题描述
如果我们指定如下所示的列,则客户端排序有效。
查看页面
<ngx-datatable class="material" [rows]="rows" [columns]="columns"> </ngx-datatable>
ts 页面
columns = [{ prop: 'name' },{ name: 'Gender' },{ name: 'Company' }];
但是如果我们从 ts 页面中删除列定义,然后在视图页面中将它们指定为
<ngx-datatable class="material" [rows]="rows">
<ngx-datatable-column>
<ng-template ngx-datatable-header-template>
<span>name</span>
</ng-template>
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.name }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column>
<ng-template ngx-datatable-header-template>
<span>Gender</span>
</ng-template>
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.Gender}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column>
<ng-template ngx-datatable-header-template>
<span>Company</span>
</ng-template>
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.Company}}
</ng-template>
</ngx-datatable-column>
</ngx-datatable>
排序失败。 知道为什么会发生这种情况.. 提前致谢。
解决方法
您的 HTML 模板似乎有问题。这对没有列定义的我有用。
<ngx-datatable [rows]="rows">
<ngx-datatable-column name="name">
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.name}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="company">
<ng-template let-row="row" ngx-datatable-cell-template>
{{row.company}}
</ng-template>
</ngx-datatable-column>
</ngx-datatable>
同样,我们可以使用这些方式进行排序。
<ngx-datatable class="material" [rows]="rows" [sorts]="[{prop: 'name',dir: 'desc'}]">
,
<ngx-datatable-column [sortable]="true" name="name">
或
columns = [
{ name: 'company',sortable: true },{ name: 'name',sortable: false }
];