我将Cell
个对象数组绑定到PrimeNG DataTable:
html的:
<p-dataTable [value]="_cells" [responsive]="true" [globalFilter]="gb">
<p-column field="id" header="id" sortable="true"></p-column>
<p-column field="name" header="name" sortable="true" ></p-column>
</p-dataTable>
.TS:
ngOnInit() {
var self = this;
// Capture the id in the URL
this._route.params.subscribe(params => {
self._stationId= params['id'];
this._dataService
.GetAllCells(self._stationId)
.subscribe((data:Cell[]) => this._cells = data,
error => alert(error),
() => console.log('Retrieved cells'));
});
}
所以我发现dataTable有一个reset()
方法来清除排序/过滤/选择状态。每当URL参数发生变化并且正在加载新数据时,我都需要调用它。
但是如何引用dataTable并从reset()
方法中调用ngOnInit()
方法?
答案 0 :(得分:16)
您可以利用@ViewChild
注释:
export class MyComponent implements OnInit {
@ViewChild(DataTable) dataTableComponent: DataTable;
// ...
ngOnInit() {
this.dataTableComponent.reset();
}
}
答案 1 :(得分:0)
感谢rinukkusu。 在更新版本的primeng中,其工作方式如下:
//Just replace DataTable with Table
import {Table} from 'primeng/components/table/table';
export class MyComponent implements OnInit {
@ViewChild(Table) tableComponent: Table;
// ...
ngOnInit() {
this.tableComponent.reset();
}
}