Angular * ngFor使用异步管道绑定到observable - 发生什么事?

时间:2017-09-12 06:19:49

标签: angular asynchronous pipe ngfor

我刚开始使用angular4并遇到了一个概念问题。 async管道(在这种情况下与*ngFor结合使用)用于订阅可观察对象并取消手动订阅。查看网络上的示例:

案例1:绑定到包含Observable<User>

等单个项目的可观察对象

案例2:绑定到包含诸如的项目数组的observable Observable<User[]>

案例3:主题,承诺或行为主体的1和2的变化

(案例1单项的示例:http://briantroncone.com/?p=623

(案例2数组的示例:http://www.concretepage.com/angular-2/angular-2-async-pipe-example

从概念上讲,我得到ngFor迭代一个可枚举的,我假设可枚举是从Observable而不是可观察本身发出的项。

所以* ngFor =“让用户的用户”只能使用Observable<User[]>而不是Observable<User>

每个项目从观察者到达时会触发*ngFor吗?

如果是这种情况,那么我们如何绑定Observable Item而不是Item[],当它不是可枚举时,ngFor如何迭代Item?感谢。

1 个答案:

答案 0 :(得分:0)

  

* ngFor =“让用户的用户”只能使用Observable<User[]>而不是Observable<User>

是的,NgFor指令会为可迭代中的每个项目创建一个模板。请参阅NgFor的 description 。所以 Iterable不是Object

  

* ngFor会在每个项目从observable到达时被触发吗?

不,在使用observable时,NgFor将在observable发出值时发挥作用(整个可迭代不是它的前置项)。

  

如果不是枚举,ngFor如何迭代Item?

由于ngFor仅支持Iterable,因此您可以ArrayObject.values创建将对象转换为Object.keys的管道,以便ngFor可以迭代。