angular - 订阅 ref.on (‘value’ 时出现 Firebase 错误，回调)； |类型 'subscribe' 上不存在属性 '(a: DataSnapshot, b?: string) => any'

Question

我在 Angular 中使用 firebase 实时数据库。我正在尝试实时从 firebase 服务器获取一些数据:(来自服务的代码)

getData(child){
        return firebase.database().ref(child).on('value', (snapshot) => {
            console.log(snapshot.val())
        })
    }

并在我的组件中订阅上述功能:

this.examinerService.getData('batches/names').subscribe(
      (batches) => {
        this.batches = batches.val();
      }
    )

哪个给我错误:

Property 'subscribe' does not exist on type '(a: DataSnapshot, b?: string) => any'

我试过使用 ref().once() 效果很好，但我想要实时行为。

更新:目前我在我的组件中使用 database().ref().on('value', (snapshots) => { console.log(snapshots.val()); });很好，但我想在我的服务中完成它并在我的组件中订阅它。有人告诉我它不是可观察的，所以你不能订阅它。我是 Angular 的新手，所以我不知道如何制作可观察对象并使用它绑定(bind)快照。

Answer 1

函数 getData 返回传递的回调而不是代码似乎期望的 Observable。您可以修改该函数，以便返回一个您可以 .subscribe() 返回的 Observable。

import { Observable } from 'rxjs/Observable';

getData(child) {

  return Observable.create(subscriber => {
    const ref = firebase.database().ref(child);

    const callbackFn = ref.on('value',
      // emit a value from the Observable when firebase data changes
      (snapshot) => subscriber.next(snapshot.val()),

      // error out the Observable if there is an error
      // such as permission denied
      error => subscriber.error(error)
    );

    // The function passed to Observable.create can return a callback function
    // which will be called when the observable we created is unsubscribed from.
    // Just as we used `ref.on()` previously our callback function calls `ref.off`
    // to tell firebase that we are no longer interested in the changes
    return () => ref.off('value', callbackFn);
  });
}