要实现的效果
出现的问题
本地上测试一切正常,打包后上传成元部件,发不成部件以后出现以下问题
1、页面初次加载列表内容显示正常、数量也显示正常
2、点击预警按钮不显示预警列表,点击报警按钮后显示预警的列表,再次点击报警按钮显示报警的里列表内容
3、每次点击切换打印出来的数据都正常,就是列表展示的数据不正常
解决办法:
在异步获取数据结束后增加视频变更检测机制
import { ChangeDetectorRef } from '@angular/core'
constructor(
private cd:ChangeDetectorRef
) { super() }
getData(msgType, state) {
//异步数据获取的方法
this.service.getAlarmData(msgType, state).subscribe(data => {
this.defaultListData = this.listData
//在这加变更检测机制,切换视图的时候就可以正常加载数据了
this.cd.markForCheck();
})
}