首页 文章

Angular 5:* ngIf =“isValid; else other_content”VS * ngIf =“isValid” . * ngIf =!“的isValid”

提问于
浏览
2

这个问题是关于理解为什么一种技术比另一种技术更好 . 在角度4/5中,在模板内部,您可以通过以下方式实现相同的目的:

*1) ngIf-else syntax

<div *ngIf="isValid;else other_content">
    content here ...
</div>

<ng-template #other_content>other content here...</ng-template>

**2) ngIf="isValid" ngIf="!isValid"

<div *ngIf="isValid">
  content here ...
</div>

<div *ngIf="!isValid">
 other content here...
</div>

这两种语法完全有效,语法为1,你可以更进一步,如描述here,但有没有任何性能/最佳实践建议使用一个与另一个?

1 回答

  • 1

    两个 ngIf 指令被编译两次,导致两个绑定而不是一个 .

    如果表达式包含管道,这会变得更加混乱:

    <div *ngIf="isValidAsync | async">...</div>
    <div *ngIf="!(isValidAsync | async)">...</div>
    

    将导致两个订阅 .

    完全支持 ngIf else模板来解决这种情况,应该用作经验法则 .

相关问题