Angular 将多个元素绑定到一个从函数返回的对象

Question

我正在使用 Angular 7. 我有一个列出建筑物的 table，其中每个建筑物都有几个美元价值（例如个人属性、特殊设备， ETC）。在 table 页脚中，我想对这些值求和。

负责的组件有一个输入属性，其中包含多个组建筑物，本质上是一组建筑物，我想得到的总和每个内部数组。

这个组件是否可以有一个函数，它接受一组建筑物和returns一个对象，其属性是各种总和，并将多个DOM元素绑定到那个1 个函数生成的对象？

我希望避免每次求和都要遍历建筑物一次，并避免将计算值存储在组件中。类似于在 DOM 元素中 "store" 对象的能力，类似于 *ngFor 中的 let？我只需要它用于一种方式绑定。

类似这样的东西（ngVariable 的构成）：

<tfoot ngVariable="sumBuildings(group) as sums">
    <td>{{ sums.persProp }}</td>
    <td>{{ sums.specEquip }}</td>
</tfoot>

如果没有这样的事情，我的下一个计划是只构建一个内部组件来处理一组建筑物，并且可以在 init 上计算总数，然后我可以绑定到那个对象。但是 ngVariable 听起来更简单。

谢谢！

Answer 1

好吧，我不知道这是否是 "appropriate" 解决方案，但它确实有效。 *ngIf 完全符合我的要求。我能够写：

<tfoot *ngIf="sumBuildings(group) as sums">
    <td>{{ sums.persProp }}</td>
    <td>{{ sums.specEquip }}</td>
</tfoot>

而且我能够绑定到 sums。因为我使用了副作用，所以感觉很脏，但它满足了我的需要。

Angular Bind Multiple Elements to One Object Returned from Function