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;
}
“我相当乐意花一天的时间通过编程把一个任务实现自动化,除非这个任务手动只需要10秒钟就能完成”