Angular 异步管道的正确含义是什么？

Question

我是Angular新手，对这段代码有以下疑问

在视图中我有这段代码：

<li *ngFor="let hero of heroes$ | async" >
  <a routerLink="/detail/{{hero.id}}">
    {{hero.name}}
  </a>
</li>

迭代 heroes$。这不是一个数组，而是一个 Observable，因为它正在处理相关组件的这个 属性：

heroes$: Observable<Hero[]>;

我不是很清楚。

按照我的解读（请确认或反驳）。

• *ngFor 不能直接迭代 heroes$ 因为它是一个 可观察.

• 这个 Observable 发出一个 Hero 的数组，但这是一个异步行为。

• async 管道是订阅这个 Observable 的东西，当它准备好时（当发出数组时） *ngFor 指令可以迭代这个数组。

在实践中，通过这种方式，我可以直接在视图中执行此操作，而不是在订阅 Observable 的组件中执行。

Answer 1

这样写就更清楚了： (heroes$ | async) as heroList