原型链如何与angular5中的RxJS一起使用？

Question

在一个有角度的5项目中，我试图处理Observables但不了解导入单独的operators时它如何工作。

考虑将fromPromise与map链接fromPromise ：

import { fromPromise } from 'rxjs/observable/fromPromise';
import { map } from 'rxjs/operator/map';

与fromPromise().map()返回错误： fromPromise_1.fromPromise(...).map is not a function

和

import  'rxjs/add/observable/fromPromise';
import { Observable } from 'rxjs/Observable';
import { map } from 'rxjs/operator/map';

与Observable.fromPromise().map()返回错误： Observable_1.Observable.fromPromise(...).map is not a function

但

import Rx from 'rxjs/Rx';

与Rx.Observable.fromPromise().map()一起按预期工作

喜欢

import { fromPromise } from 'rxjs/observable/fromPromise';
import { map } from 'rxjs/operator/map';

与map.call(fromPromise(),)

有人可以解释吗？

Answer 1

在使用管道运算符之前，您必须在Observable的原型中添加一个运算符才能使用它。

import  'rxjs/add/observable/fromPromise';

此行将fromPromise运算符添加到Observable的原型中。 您可以在此处查看源代码。 因此，添加错误后，错误会继续显示在map 。 如果您还为map添加了一个map那么它可能会开始为您工作。

import Rx from 'rxjs/Rx';

该行将导入所有内容，其中包括将所有运算符猴子修补到Observable原型上。 这可能会增加您的套装尺寸，因此应避免使用。

如果您使用的是RxJs 5.5+，则可以在执行操作的地方使用管道运算符：

import { map } from 'rxjs/operators';

autobots.pipe(map(autobot => transform(autobot));