angular6的等待提示框
阿新 • • 發佈:2018-12-13
安裝ngx-loading外掛:
npm install --save ngx-loading
在應用程式的主module中匯入ngx-loading模組
import {NgxLoadingModule} from 'ngx-loading';
...
imports:[
...
NgxLoadingModule
...
]
使用
在子頁面html模板中加入:
<ngx-loading [show]="loading" [config]="{ backdropBorderRadius: '14px' }"></ngx-loading>
在ts程式碼中設定loading成員控制等待框是否顯示
loadData(pageIndex: number, pageSize: number) {
this.loading = true;
this.dataService.httpGet(url地址).map(res => res.text()).subscribe(
res => {
//從服務端獲取資料成功,處理資料
}
this.refreshStatus();
this.loading = false;
}
, error => {
this.error = error;
this.loading = false;
});
}