import { Component , OnInit } from '@angular/core' ; import { RandomUserService } from '../randomUser.service' ; import { NzMessageService } from 'ng-zorro-antd' ; @ Component ( { selector : 'app-table-standard' , templateUrl : './standard.component.html' } ) export class TableStandardComponent implements OnInit { data = [ { key : '1' , name : 'John Brown' , age : 32 , address : 'New York No. 1 Lake Park' , } , { key : '2' , name : 'Jim Green' , age : 42 , address : 'London No. 1 Lake Park' , } , { key : '3' , name : 'Joe Black' , age : 32 , address : 'Sidney No. 1 Lake Park' , } ] ; ageSort = '' ; ageSortChange ( $event ) { if ( $event === 'ascend' ) { this . data = [ ... this . data . sort ( ( a , b ) => { return a . age - b . age ; } ) ] ; } else if ( $event === 'descend' ) { this . data = [ ... this . data . sort ( ( a , b ) => { return b . age - a . age ; } ) ] ; } } _allChecked = false ; _indeterminate = false ; _displayData = [ ] ; _displayDataChange ( $event ) { this . _displayData = $event ; this . _refreshStatus ( ) ; } _refreshStatus ( ) { const allChecked = this . _displayData . every ( value => value . checked === true ) ; const allUnChecked = this . _displayData . every ( value => ! value . checked ) ; this . _allChecked = allChecked ; this . _indeterminate = ( ! allChecked ) && ( ! allUnChecked ) ; } _checkAll ( value ) { if ( value ) { this . _displayData . forEach ( data => { data . checked = true ; } ) ; } else { this . _displayData . forEach ( data => { data . checked = false ; } ) ; } this . _refreshStatus ( ) ; } _current = 1 ; _pageSize = 3 ; _total = 1 ; _ajaxDataSet = [ ] ; _ajaxLoading = true ; constructor ( private _randomUser , private message ) { } _ajaxRefreshData = ( ) => { this . _ajaxLoading = true ; this . _randomUser . getUsers ( this . _current , this . _pageSize ) . subscribe ( ( data ) => { console . warn ( data ) ; this . _ajaxLoading = false ; this . _total = 200 ; this . _ajaxDataSet = data . results ; } ) ; } ; ngOnInit ( ) { this . _ajaxRefreshData ( ) ; this . _genData ( ) ; } _dataSet = [ ] ; _bordered = false ; _loading = false ; _pagination = true ; _header = true ; _title = true ; _footer = true ; _size = 'small' ; _noresult = false ; _toggleData ( ) { if ( this . _noresult ) { this . _dataSet = [ ] ; } else { this . _genData ( ) ; } } _genData ( ) { this . _dataSet = [ ] ; for ( let i = 1 ; i <= 10 ; i ++ ) { this . _dataSet . push ( { key : i , name : 'John Brown' , age : `${ i }2` , address : `New York No. ${ i } Lake Park` , description : `My name is John Brown, I am ${ i }2 years old, living in New York No. ${ i } Lake Park.` , } ) ; } } cancel = function ( ) { this . message . info ( 'click cancel' ) ; } ; confirm = ( ) => { this . message . success ( 'click confirm' ) ; } ; }