ngIf 和 template的结合使用

前提： 当遇到 一个种情况，一个元素中既可以显示 一个字符串变量，也可以显示一个模板

实现：

// html

 <span class="ant-alert-message" *ngIf="nzMessage">
    <ng-container *ngIf="isMessageString; else messageTemplate">{{ nzMessage }} + 123</ng-container>
    <ng-template #messageTemplate>
        <ng-template [ngTemplateOutlet]="nzMessage"></ng-template>
    </ng-template>
</span>

<ng-template #messag>
    这是一个模板
</ng-template>


// ts

 @ViewChild('messag') _message: string | TemplateRef<void>; //定义 _message是一个模板

set nzMessage(value: string | TemplateRef<void>) {
    this.isMessageString = !(value instanceof TemplateRef);
    this._message = value;
   }

get nzMessage(): string | TemplateRef<void> {
    return this._message;
　　}

ngOnInit(): void {

　　// this.nzMessage = '这是一个字符串';  

　　this.nzMessage = this._message;

}

　　

转载于:https://www.cnblogs.com/flxy-1028/p/9853610.html