如何在Angular模板中声明变量？

Question

这是源代码

<div>
{{ getActualData() }}
</div>
<div>
{{ getVirtualData() }}
</div>
<div>
 {{ getActualData() - getVirtualData() }}
</div>

这就是我要的.

<div>
{{ actual = getActualData() }}
</div>
<div>
{{ virtual = getVirtualData() }}
</div>
<div>
{{ actual - virtual }}
</div>

由于两个函数都很复杂,我想暂时保存数据并尽快计算差异.有没有办法做到这一点？

Answer 1

您可以在模板中声明变量,使用let它来评估函数并获得结果,使用ngIf实际检查值是否存在并分配给变量

<div *ngIf="getActualData(); let actual" > 
<div *ngIf="getVirtualData(); let virtual" > 
 {{actual - virtual}}
</div>

DEMO

Answer 2

你可以试试 ：

    <div *ngIf="getActualData(); let actual">
      <div *ngIf="getVirtualData(); let virtual">
        {{ actual - virtual }}
      </div>
    </div>
    </div>

这是一个解决方法，但应该有效