Angular 2+中* ngIf与[ngSwitch]之间的区别

Question

[ngSwitch]和一堆*ngIfs 有什么区别。我们应该关注任何性能因素吗？

* ngIf

  <div *ngIf="day === 'MONDAY'">
     Keep calm and pretend it's not Monday.
  </div>
  ...
  <div *ngIf="day === 'FRIDAY'">
     Happy Friday!
  </div>

[ngSwitch]

<ng-container [ngSwitch]="day">

     <div *ngSwitchCase="'MONDAY'">
         Keep calm and pretend it's not Monday.
     </div>
     ...
     <div *ngSwitchCase="'FRIDAY'">
         Happy Friday!
     </div>

</ng-container>

Answer 1

对于*ngIf，将检查每个条件并true执行条件中的代码。

对于[ngSwitch]，只会执行特定案例中的代码（使用break;）。

因此，[ngSwitch]在有多个案例的情况下会更快。

Answer 2

ngIf基本上是具有单一条件的ngSwitch版本。它与 ngShow 的不同之处在于它删除了实际的 DOM 元素而不是简单地隐藏它。如果您使用的 ngSwitch 仅进行单真条件检查，那么我相信 ngIf 会做同样的事情。