如何在 FirebaseListObservable 上使用 .take？答案

【问题标题】：How do I use .take on FirebaseListObservable?如何在 FirebaseListObservable 上使用 .take？
【发布时间】：2017-03-29 23:52:18
【问题描述】：

如果我尝试在 FireBaseListObservable 上使用 .take、.skip 等 RxJS 运算符，我会收到“take is not a function”错误：

import {Component} from '@angular/core';
import {AngularFire, FirebaseListObservable} from 'angularfire2';
import {Observable} from 'rxjs';

export class AppComponent {
  items: FirebaseListObservable<any>;

  constructor(public af: AngularFire) {
    // this works
    Observable.interval(1000).take(5).subscribe(x => console.log(x));

    this.items = af.database.list('/items');
    // this does not
    this.items.take(1).subscribe();
  }
}

编辑：通过 import "rxjs/add/operator/take" 导入 .take；确实有效，但现在我还有另一个问题：

为什么

Observable.interval(1000).take(5).subscribe(x => console.log(x));

即使不导入镜头也能工作？

我如何将 Observable 转换为 FirebaseListObservable？

【问题讨论】：

您能否包含您用于Observable 的import 语句？
我已经用一个示例演员更新了答案（以及我提到它的原因）。在使用 import {Observable} from 'rxjs'; 时，您已经完整地导入了 RxJs。我没有解释为什么这不会导致 take （以及所有其他运算符）在 AngularFire2 observables 上可用。这是一个谜。要深入了解它，您需要包含所有 import 语句和版本等。如果我使用该导入，我会得到所有运算符。
@cartant：现在包括所有导入
我无法重现 angularfire2 2.0.0-beta.5 和 rxjs 5.0.0-beta.12 的问题。以您的方式导入Observable 让我获得了所有操作员。你的错误是 TypeScript 错误而不是运行时错误，对吧？
我的错误是运行时错误：zone.js:390Error: Uncaught (in promise): Error: Error in ./AppComponent class AppComponent_Host - inline template:0:0 由：this.items 引起。 take 不是函数（…）不过我使用的是 beta.6

标签： rxjs angularfire2

【解决方案1】：

RxJS 的分发方式允许其整体或小块导入。

对于要包含的 take 运算符及其 TypeScript 声明，您可以选择完整导入 RxJS：

import * as Rx from "rxjs/Rx";

或者可以只导入您需要的take 运算符：

import "rxjs/add/operator/take";

请注意，AngularFire2 observables 实现了lift 用于与运算符的组合。这样做的效果是，在您使用运算符后，类型将是 Observable<T> 而不是 FirebaseListObservable<T>，因此如果您将组合的 observable 分配给 FirebaseListObservable<T> 变量或属性，您将需要强制转换。

例如：

let item = af.database.list('/items').take(1) as FirebaseListObservable<any>;

但是，如果您打算将变量用作FirebaseListObservable（它有其他方法），您只需要这样做。通常，您会将其保留为Observable。（我提到这一点是因为您有一个类型为 FirebaseListObservable<any> 的属性，而我已经看到这会在许多其他问题中引起混淆。）

关于您在 cmets 中提到的针对该问题的错误，导入之间的相互作用很重要。如果您像这样导入Observable：

import { Observable } from "rxjs";

您将包含完整的 RxJS，并且在编写 FirebaseListObservable 实例时所有运算符都应该可用。

但是，如果导入的 Observable 在它所导入的模块中没有在任何地方使用，它就会被忽略，并且您不会得到任何导入的东西.这可能就是您需要显式导入 take 的原因。

【讨论】：

感谢您的回答，我现在有更多问题；）查看编辑。