有没有办法将管道的结果保留在 Angular 2 中的模板输入变量中？

Question

我真的很喜欢该指令的语法*ngFor。您可以迭代数组的所有元素。

我想用管道的结果来实现同样的效果。例如async管道。当async我将管道放置在模板中使用可观察结果的属性的任何位置时，我正在进行大量订阅，并且我的模板中充斥着类似{{(someObservable$ | async)?.propertyName}}. 有没有办法像这样简单地将管道的当前结果绑定到模板输入变量？

<div let="currentValue = someObservable$ | async">
  {{currentValue?.foo}}, {{currentValue?.bar}}
  ...
</div>

我尝试将此与 结合使用*ngIf，但这似乎不是有效的模板表达式：

<div *ngIf="let currentValue = someObservable$ | async">
  {{currentValue?.foo}}, {{currentValue?.bar}}
  ...
</div>

Answer 1

是的！从 Angular 4+ 开始，我们可以存储success*ngIf的结果，例如：

<div *ngIf="userObservable | async; else loading; let user">
  Hello {{user.last}}, {{user.first}}!
</div>
<template #loading>Waiting...</template>

如果您需要与 相同*ngFor，只需将其包裹起来*ngIf;-)

来源