
























参考:https://angular.cn/api/common/NgIf
Angular 扩展了ngIf 指令, 加入了两个新伙伴 else 和 then。
ngIf 内的 expression并会对expression进行求值,如果为真,则在原地渲染then模板,否则渲染else模板。通常:
then模板就是ngIf中内联的模板 —— 除非你指定了另一个值。else模板是空白的 —— 除非你另行指定了。当表达式为false,用于显示的模板。 注意,else绑定指向的是一个带有#elseBlock标签的<ng-template>元素。 该模板可以定义在此组件视图中的任何地方,但为了提高可读性,通常会放在 ngIf的紧下方。
<button (click)="show = !show">{{show ? 'hide' : 'show'}}</button>
<div *ngIf="show; else elseBlock">to show</div>
<ng-template #elseBlock>Alternate text while primary text is hidden</ng-template><div *ngIf="show; then thenBlock; else elseBlock">this is ignored</div>
<ng-template #primaryBlock>Primary text to show</ng-template>
<ng-template #secondaryBlock>Secondary text to show</ng-template>
<ng-template #elseBlock>Alternate text while primary text is hidden</ng-template>你完全写一堆ngIf进行判断分支判断,这样会导致代码可读性比较差。
此内容由惯性聚合(RSS阅读器)自动聚合整理,仅供阅读参考。 原文来自 — 版权归原作者所有。