export class RComponent implements OnInit { data: any; ngOnInit() { this.data = require('../data/hengxiangduibi.json'); } rows: any[] = [ { Name: 'Data 1',Amount: 100.23,Date: 1477545980000 },{ Name: 'Data 2',Amount: 0.875623,Date: 1477545989000 },{ Name: 'Data 3',Amount: .010123,{ Name: 'Data 4',Amount: 1873.02301,{ Name: 'Data 5',Amount: -93,Date: 1477545983000 },{ Name: 'Data 1',Date: 1477545983000 } ]; columns: any[] = [ { display: 'Column 1',//The text to display variable: 'Name',//The name of the key that's apart of the data array filter: 'text' //The type data type of the column (number,text,date,etc.) },{ display: 'Column 2',//The text to display variable: 'Amount',//The name of the key that's apart of the data array filter: 'decimal : 1.0-2' //The type data type of the column (number,{ display: 'Column 3',//The text to display variable: 'Date',//The name of the key that's apart of the data array filter: 'dateTime' //The type data type of the column (number,etc.) } ]; sorting: any = { column: 'Name',//to match the variable of one of the columns descending: false }; }
<table-sortable [columns]="columns" [data]="rows" [sort]="sorting"> Loading table... </table-sortable>
效果:
还有小瑕疵,不影响使用