开发者问题收集

Angular 2 Firebase Observable 承诺不会返回任何内容

2017-01-27
7059
typescript angularfire2 angular2-observables

我目前正在使用 AngularFire2 开发一个 Angular 2 项目，我正在尝试将 FirebaseListObservable 转换为 Promise。我知道这没有多大意义，因为 Observable 更有用，但这个函数将成为另一个将多个 Promise 链接在一起的函数的一部分。而且我不熟悉如何在 Promise 链中订阅 Observable... 该函数在服务中执行，但它似乎没有返回任何内容。 基本上，我想要做的是检查 Firebase 列表中是否存在具有特定名称的对象，并返回 true 或 false。

服务 

constructor(private _af: AngularFire) { }

nameExists(name: string): Promise<boolean> {

 return this._af.database.list('users')
  .map(users => {

    let exists = false;
    users.forEach(user => {
      if(user.name.toLowerCase() === name.toLowerCase()) {
        console.log('Name already exists!');
        exists = true;
      }
    });
    return exists;
  }).toPromise();
}

组件 

constructor(private _usersService: UsersService) { }

check(name) {
 this._usersService.nameExists(name)
  .then(bool => console.log(bool));
}

因此，当匹配时，该函数会执行，并且似乎正常工作，因为它会打印到控制台。但是，组件中的 console.log() 不会执行。我猜“then”部分永远都不会到达。另外，有没有办法在找到匹配项后停止 forEach 循环？

任何帮助都将不胜感激，因为我根本找不到任何答案。

2个回答

问题在于 toPromise 运算符将可观察对象转换为承诺，该承诺将解析为可观察对象的最终值。这意味着可观察对象必须在承诺解析之前完成。

在 AngularFire2 中，列表和对象可观察对象不会完成；只要数据库发生变化，它们就会重新发出。

您可以使用 first 运算符解决该问题，该运算符采用第一个发出的值，然后完成组合的可观察对象： 

import 'rxjs/add/operator/first';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
...
return this._af.database
  .list('users')
  .map(users => {

    let exists = false;
    users.forEach(user => {
      if (user.name.toLowerCase() === name.toLowerCase()) {
        console.log('Name already exists!');
        exists = true;
      }
    });
    return exists;
  })
  .first()
  .toPromise();
cartant
2017-01-27

我通过在收到第一条数据后取消订阅来解决这个问题:) 

const userSubs$ = this.db.object(`branch/${branchId}/products`).subscribe(
                     async (payload: any) => {
                      userSubs$.unsubscribe();
                       })

或者将您的代码转换为类似的好方法:) 

 const eventref = this.db.database.ref(`branch/${branchId}/products`);
  const snapshot = await eventref.once('value');
  const productArray = snapshot.toJSON()
  return productArray;

快乐编码

Divek John
2021-03-02