ngIf - 否则对两个ngIf条件

Question

请考虑以下代码示例:

<div *ngIf="condition; else elseBlock">
    <!-- markup here --> 
</div>
<ng-template #elseBlock>
     <div>
         <!-- additional markup here -->
     </div> 
</ng-template>

我可以实现相同功能的另一种方法是:

<div *ngIf="condition">
    <!-- markup here --> 
</div>
<div *ngIf="!condition">
     <!-- additional markup here -->
</div>

我想知道应该使用这两种方式中的哪种方式的具体原因以及原因？

Answer 1

使用else可以避免两次写入条件,这可能是错误的来源,所以我会优先使用它.如果您愿意,也可以将else模板放在模板的底部,这样可以使模板更易于阅读.

如果你用async管道展开一个observable ,那么写起来要容易得多

<div *ngIf="myItems$ | async as myItems; else noItemsYet">

而不是添加另一个<div *ngIf="!(myitems | async)">,这也将迫使Angular创建另一个内部订阅.

作为意见问题投票决定关闭这个问题的人是错误的.人们可能对某些事情有不同意见这一事实并不意味着没有值得提出的有效观点.

如果使用else只是一个偏好的问题,我怀疑Angular开发人员会像Angular 4那样优先考虑Angular 4.

正如@Ishnark指出的那样,也可能存在性能影响.