angular 变更检测机制，视图中点击按钮后不能切换数据，再次点击按钮后才显示正确的列表内容

要实现的效果

出现的问题
本地上测试一切正常，打包后上传成元部件，发不成部件以后出现以下问题
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();
      })
}