很长一段时间以来，我一直在HTML页面中大量使用Angular的条件：
<p *ngIf="var === true">Test</p>
(例如(
除了在一些页面上，我有*ngIf要做几十次检查(有时甚至在同一页面中的几个标签上使用(
<p *ngIf="var1 === true && var2 === true && var3 === true && var4 === true && var5 === true && var6 === true && var7 === true && var8 = == true && var9 === true && var10 === true">Test</p>
(例如(
所以我只是修改了一下：
<p *ngIf="this.isVarsTrue()">Test</p>
在我的TS页面
isVarsTrue () {
if (var1 === true && var2 === true && var3 === true && var4 === true && var5 === true && var6 === true && var7 === true && var8 === true && var9 === true && var10 === true) {
return true;
} else {
return false;
}
}
然而，通过在这种方法中添加控制台日志，我发现它被调用了很多次(在接近就绪的页面上，每个操作调用5次(，因此我想知道这是否是一个好的做法。
谢谢你的回答。
这是因为当您使用每个组件默认使用的ChangeDetectionStrategy.Default时，角度变化检测是如何工作的(除非您更改它(。我想说，检查是否满足耦合条件并不是一个巨大的成本(除非您有复杂的逻辑，并且您的应用程序足够快(。您可以做的是更改ChangeDetectionStrategy或将此条件的结果存储在某个变量中，并在需要时重新计算。
在这种特定情况下，我不认为它会真正损害性能。
然而，为了不在每次渲染中执行相同的代码，我建议创建一个新的组件布尔变量，该变量只有在多个变量更改时才会更新。它的可读性更强，可以防止您在函数开始变得更复杂的情况下执行代码
正如注释所述，使用您给出的简单函数时，性能几乎没有差异，甚至可能是有益的，因为您说过它在多个地方使用。屏幕上的每个事件都会触发您的检查，无论是在HTML中还是在打字脚本中。作为我自己的一条规则，我保留任何HTML文件中的函数调用(除了像点击或更改事件这样的特殊事件(，以防止自己做一些愚蠢的事情，使我的应用程序变得超级滞后。
以下是我个人认为在HTML中调用哪些类型的函数是安全/不安全的：
如果您从HTML调用这些类型的函数
- 布尔值/对象/字符串/数字等。支票
- 简单if语句
不要从HTML调用这些类型的函数
- 在数组上迭代
- 可观察/主题/承诺电话
- 服务器调用
- 超时/等待