ngIf - else vs 两个 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

第一种解决方案更好。虽然两者实现的是相同的东西，但前者更清晰，更容易从逻辑上理解。

对于第一种解决方案，您只需进行一次检查。这是一个很好的解决方案，因为:

< li >评估病情需要时间。 < li >通过使用else，您只需检查一次。在第二个解决方案中，您检查是否满足某个条件(这需要时间)，然后检查< I >相同条件的not是否满足。 < li >使用else允许您在两个条件都不满足的情况下执行操作。

编辑：参见@toazaburo的回答，它解决了不安全问题。

Answer 2

使用 else 可以避免两次编写条件，这可能是错误的根源，所以我会优先使用它。如果您愿意，您还可以将 else 模板放在模板底部，这将使模板更易于阅读。

如果您使用async管道展开可观察对象，那么编写起来会容易得多

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

而不是添加另一个＜code＞

那些投票结束这个问题的人是被误导的。人们可能对某件事有不同意见，这并不意味着没有值得提出的有效观点。

如果使用else只是一个偏好问题，我怀疑Angular开发人员会像他们那样优先考虑Angular4。

正如@Ishnark指出的，这也可能会影响性能。