在Angular2 2/Firebase应用程序中的组件中有以下代码:
ngOnInit() {
this.allItems = this.angularFireDatabase.object(`projects/${id}/results`).map(
results => {
const x = itemMapper(results);
console.log(x); // <-- executes three times
return x;
});
const groupedData = this.allItems.map(groupMapper);
this.towers = groupedData.map(towerMapper);
this.units = groupedData.map(unitMapper);
}我在模板中使用this.allItems、this.towers和this.units,并使用async管道:
<sanddance [items]="allItems | async">
<p-dataTable [value]="towers | async">
<p-dataTable [value]="units | async">代码运行良好,但--问题是日志执行了三次--换句话说,创建this.allitems的映射运行了三次。如果我删除了this.towers和this.units赋值,那么日志只按预期执行一次。换句话说,this.towers = groupedData.map(towerMapper);行似乎导致了对创建this.allItems的映射程序的额外调用,尽管它不需要,我也不想这样做。它甚至可能是从Firebase数据库重新访问数据,这显然是一个问题,特别是因为这是大量的数据?
基于我对“热”和“冷”可观测性的有限理解,AngularFire似乎被视为“热”,当下游的人试图映射它(或订阅它,这基本上就是async管道所做的)时,它被重新触发。
我遗漏了什么?
发布于 2017-04-28 03:38:20
AngularFire2观测数据是冷观测数据。每个订阅都将看到内部创建的一个单独的Firebase Reference --然后将侦听器附加到其中,等等。
当订阅了代码段中的组合可观测值时,每个都会对可观察到的AngularFire2 object进行订阅。如果希望使用单个订阅,则可以使用 运算符:
import 'rxjs/add/operator/share';
this.allItems = this.angularFireDatabase.object(`projects/${id}/results`).map(
results => {
const x = itemMapper(results);
console.log(x); // <-- this should execute only once
return x;
}).share();
const groupedData = this.allItems.map(groupMapper);
this.towers = groupedData.map(towerMapper);
this.units = groupedData.map(unitMapper);share操作符:
返回一个新的可观测到的多播(共享)原始可观测的。只要至少有一个用户,这个可观测到的将被订阅和发射数据。当所有订阅者都取消订阅时,它将从可观察到的源中取消订阅。因为可观察到的是多播,所以流很热。这是
.publish().refCount().的别名
https://stackoverflow.com/questions/43671465
复制相似问题