ValueChanges & SnapshotChanges,不要再通过Firebase AngularFire2获取完整列表



最近AngularFire处理对象/列表的方式以及在整个应用程序中引用对象的方式发生了一些严重问题。

最重要的是旧的AngularFireObject & AngularFireList与新的相比是如何工作的。我们的应用程序过去/现在高度依赖于$key值,因为我们进行了广泛的非规范化(如推荐)。

现在,文档使用一个映射示例来获取$key值,但这并不相同,甚至valueChanges()似乎也不相同。

我不完全确定我们现在应该如何处理这些变化。

考虑:

老办法

/* /items/
a/{name: 'Dennis', city: 'Dallas'}
b/{name: 'Katie', city: 'Austin'}
c/{name: 'Will', city: 'Chicago'}
*/
let myAfList = this.af.list('path/to/items');
let itemsFirst, itemsSecond, itemsThird;
myAfList.subscribe(items => itemsFirst = items);
setTimeout(_ => myAfList.subscribe(items => itemsSecond = items), 1000);
setTimeout(_ => myAfList.subscribe(items => itemsThird = items), 2000);
/* Results for all three item arrays
itemsFirst: [
{name: 'Dennis', city: 'Dallas', $key: 'a'},
{name: 'Katie', city: 'Austin', $key: 'b'}
{name: 'Will', city: 'Chicago', $key: 'c'}
];
*/

所有三个订阅都正确地获得了完整的项目阵列,并设置为侦听未来的更改

价值变化的新方式:

let myAfList = this.af.list('path/to/items').valueChanges();
let itemsFirst, itemsSecond, itemsThird;
myAfList.subscribe(items => itemsFirst = items);
setTimeout(_ => myAfList.subscribe(items => itemsSecond = items), 1000);
setTimeout(_ => myAfList.subscribe(items => itemsThird = items), 2000);
/* Results for ONLY itemsFirst
itemsFirst: [
{name: 'Dennis', city: 'Dallas'},
{name: 'Katie', city: 'Austin'}
{name: 'Will', city: 'Chicago'}
];
*/

ItemsFirst作为第一个订阅正确地获取项目。另外两个项目什么也得不到,但这三个项目都订阅了,以备将来更改。没有一个具有键值。

带有$key的地图

let myAfList = this.af.list('path/to/items').snapshotChanges()
.map(actions => {
return actions.map(action => {
const $key = action.payload.key;
const data = { $key, ...action.payload.val() };
return data;
});
});
let itemsFirst, itemsSecond, itemsThird;
myAfList.subscribe(items => itemsFirst = items);
setTimeout(_ => myAfList.subscribe(items => itemsSecond = items), 1000);
setTimeout(_ => myAfList.subscribe(items => itemsThird = items), 2000);
/* Results for ONLY itemsFirst
itemsFirst: [
{name: 'Dennis', city: 'Dallas', $key: a},
{name: 'Katie', city: 'Austin', $key: b}
{name: 'Will', city: 'Chicago', $key: c}
];
*/

$key现在在列表中,但它再次只在第一个项目列表中。。。

因此,快速观察到的是,对象现在实际上是核心firebase引用的简单包装器,valueChanges()需要移动到子端,如:

let myAfList = this.af.list('path/to/items');
myAfList.valueChanges().subscribe(items => itemsFirst = items);

这很管用!耶!但是钥匙呢?我必须一遍又一遍地写出map函数。或者创建我自己的函数,但它不在对象原型上,所以我必须将它添加到我在中使用的每个文件中

我错过了什么?获取$key的正确方法是什么?订阅是否总是获得完整的值?

有更好的方法吗?

您可能想要探索这种可能性:

// Generate a reference to a new location and add some data using push()
var newPostRef = postsRef.push();
// Get the unique key generated by push()
var postId = newPostRef.key;

最新更新