一组元素的Angular 2+模板变量（子项，重用值）[重复]答案

【问题标题】：Angular 2+ Template Variable for a Group of Elements (Childs, Reusing Value) [duplicate]一组元素的Angular 2+模板变量（子项，重用值）[重复]
【发布时间】：2019-06-29 01:52:51
【问题描述】：

我有一个关于在 Angular 模板中声明临时变量以将其用于多个元素（子元素）的问题，例如：（想法/预期）

<ng-container *ngVar="let theValue = item.getValue()">
  <div>{{ theValue }}</div>
  <div [class.foo]="theValue == 42">foo</div>
</ng-container>

我已经有一个解决方法。只需将值包装在一个数组中并使用 ngFor 如下：（解决方法）

<ng-container *ngFor="let theValue of [item.getValue()]">
  <div>{{ theValue }}</div>
  <div [class.foo]="theValue == 42">foo</div>
</ng-container>

但这有点脏。 - 有官方解决方案吗？

我的想法是为相同的值一次又一次地减少值的计算。我只想为多个孩子和/或属性重用计算值。

我不想每次都计算getValue()。因为无论如何我得到相同的价值。将值临时保存在组元素中可以提高性能和可读性。

没有自定义指令应该是可能的。我的意思是以前见过这样的东西。

【问题讨论】：

不完全重复，但那里给出的答案回答了你的问题。没有ngVar。您可以自己创建，也可以使用*ngIf="item.getValue() as value"。但这只有在值是真实的情况下才有效
所以我使用 ngFor [value] 的解决方法仍然更好。不依赖于布尔评估。但是没问题。以后我会关注这个功能，并查看 Angular 的 git 存储库。也许我会以官方的方式添加这个。会看到的。 - 对我来说，这不是重复的。在我看来，它是 Angular 的一个非常重要的特性，应该高度重视。 ...但是无论如何，这应该转移到 Github。
我同意你的看法。这应该在图书馆里。我不知道他们的理由是什么，事实并非如此。也许他们不想弄乱模板。据我所知，您的实现的问题在于它在每次检查时都会创建一个新数组。我相信github已经有这个功能请求了，你应该去看看

标签： html angular variables

【解决方案1】：

一种可能的解决方案是“缓存”getValue() 的返回值。这种技术称为memoization。它仅适用于纯函数，这意味着对于相同的输入，输出始终相同，并且函数没有副作用。

您可以使用装饰器以直接的方式实现此目的，这是一个可能对您有用的项目：https://github.com/darrylhodgins/typescript-memoize。

【讨论】：