首先看看多次*ngif：
Map数据

export const stautsMap: {[key: number]: string} = {
  1: '是',
  0: '否',
  2: '未知',
};

Html页面需要多次*ngif判断多行结果

<nz-tag *ngif="data?.realFiling == 1" nzColor="blue">{{statusMap[data?.realFiling]}}</nz-tag>
<nz-tag *ngif="data?.realFiling == 0" nzColor="red">{{statusMap[data?.realFiling]}}</nz-tag>
<nz-tag *ngif="data?.realFiling == 2">{{statusMap[data?.realFiling]}}</nz-tag>

优化之后：
Map数据

export const statusMap: {[key: number]: any} = {
  1: {value: '是', color: 'blue'},
  0: {value: '否', color: 'red'},
  2: {value: '未知', color: null},
};

Html页面

<ng-container *ngIf="statusMap[data?.realFiling] as realFiling">
	<nz-tag [nzColor]="realFiling?.color">{{realFiling?.value}}</nz-tag>
</ng-container>

关键点：
*ngIf as 的作用：判断 + 重命名
ng-container 不生成多余 DOM（对比 Vue 的 ）

Map数据可以定义更多的内容，例如：

statusMap = {
  1: { value: '是', color: 'blue', icon: 'check-circle', bgColor: '#e6f7ff' }
};

最终目的：
节省页面多行*ngif判断代码
*ngif as可以避免多次statusMap[data?.realFiling]取值