我正在使用智能管理角度版本,在该版本中,我只需要在组件和html之类的指令中定义数据表选项。
组件
dtOptions = {
sDom: 'rt<"bottom"p>',
pageLength: 10,
serverSide: true,
processing: true,
ajax: (dataTablesParameters: any, callback) => {
console.log(dataTablesParameters);
this.http
.post(
'https://angular-datatables-demo-server.herokuapp.com/', dataTablesParameters, {}
).subscribe(( resp : any) => {
resp = resp.json();
console.log(resp);
callback({
recordsTotal: resp.recordsTotal,
recordsFiltered: resp.recordsFiltered,
data: resp.data
});
});
},
columns: [
{ data: "id" },
{ data: "firstName" },
{ data: "lastName" }
],
};
并将这些选项传递到模板
<sa-datatable [options]="dtOptions" tableClass="table table-striped">
<thead>
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
</tr>
</thead>
</sa-datatable>
有一个名为Scroller的数据表扩展/插件,我想在我的角度应用程序中使用它。 到目前为止,我是使用NPM安装的
npm i datatables.net-scroller
然后将其导入到我的组件类中。
导入'datatables.net-scroller';
然后将其用作选项中的属性
dtOptions = {
sDom: 'rt<"bottom">',
serverSide: true,
ajax: (dataTablesParameters: any, callback) => {
console.log(dataTablesParameters);
this.http
.post(
'https://angular-datatables-demo-server.herokuapp.com/', dataTablesParameters, {}
).subscribe(( resp : any) => {
resp = resp.json();
console.log(resp);
callback({
recordsTotal: resp.recordsTotal,
recordsFiltered: resp.recordsFiltered,
data: resp.data
});
});
},
columns: [
{ data: "id" },
{ data: "firstName" },
{ data: "lastName" }
],
scrollY: 200,
deferRender: true,
scroller: {
loadingIndicator: true
}
};
但是对我没用。我也尝试过这样导入
import { scroller } from 'datatables.net-scroller'
然后使用了它,但没有任何改变。需要帮助。