angular - *ngIf 具有复合条件性能

Question

众所周知，在 *ngIf 中调用函数可能对性能不利，因为它会在每个变更检测周期中进行评估。相反，建议使用原始值(数字、 bool 值、..)或不可变值。

我的问题是 *ngIf 中的复合条件是否以相同的方式处理。我猜它也在每次变化检测中执行，但我想确认一下。

例如:

<div *ngFor="let item of items; trackBy: itemById">
    <button *ngIf="item.showAction && otherComponentCondition">Next</button>
</div>

Answer 1

是的，它们将在每个变更检测周期中重新评估。您可以通过使用 get 函数作为属性访问器和控制台日志来证明这一点。

不在表达式绑定(bind)中调用函数的最佳做法主要是因为函数往往更容易变得更复杂。

在性能方面，最好甚至不使用复合条件，而是使用一个专用变量，当其中一个复合发生变化时更改它。也就是说，作为旁注，这也是响应式编程在 Angular 中如此受欢迎的原因。

我添加了一个简单的 Stackblitz用那个例子。