BehaviourSubject的distinctUntilChanged()不是函数

时间:2016-09-23 18:13:04

标签: angular typescript rxjs

我是Rxjs的新手 我正在尝试了解BehaviourSubject 下面是我的代码

export interface State {
    items: Items[]
}

const defaultState = {
    items: []
};

const _store = new BehaviorSubject<State>(defaultState);

@Injectable()
export class Store {
    private _store = _store;
    changes = this._store.distinctUntilChanged()
        .do(() => console.log('changes'));

    setState(state: State) {
        this._store.next(state);
    }

    getState() : State {
        return this._store.value;
    }

    purge() {
        this._store.next(defaultState);
    }
}

当我运行我的项目时,我在控制台中收到此错误

platform-browser.umd.js:1900 EXCEPTION: Error: Uncaught (in promise):
EXCEPTION: Error during instantiation of Store! (StoreHelper -> Store).
ORIGINAL EXCEPTION: TypeError: this._store.distinctUntilChanged is not a function

任何人都可以帮助我。此外,如果我想要做的是为我的模型对象创建一个商店,所以如果有任何其他更简单的方法随时建议它。

感谢任何帮助。

2 个答案:

答案 0 :(得分:27)

您必须导入整个rxJs库或特定的库。

<input type="tel" maxlength="10"  ng-model="phone" ng-pattern="/(?:\(?\+\d{2}\)?\s*)?\d+(?:[ -]*\d+)*$/">

更新rxjs&gt; 5.5 with Pipeable Operators,

import 'rxjs/add/operator/distinctUntilChanged';

可管道操作员有助于建筑物和树木摇晃。

要了解有关benefits of Pipeable operators you may look in here的更多信息。

希望这会有所帮助!!

答案 1 :(得分:3)

您实际上必须导入所有运营商(即dodistinctUntilChanged)以及BehaviorSubject

import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/do';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

请参阅plnkr演示:http://plnkr.co/edit/Wbqv95EiG8BnzC8BpD7E?p=preview

顺便说一下,我对private _store = _store这样的陈述要小心,因为即使它做了你想做的事情,也很难阅读。

这是从https://www.typescriptlang.org/play/生成的。

define(["require", "exports"], function (require, exports) {
    "use strict";
    var _store = new BehaviorSubject(defaultState);
    var Store = (function () {
        function Store() {
            this._store = _store;
            this.changes = this._store.distinctUntilChanged()
                .do(function () { return console.log('changes'); });
        }
        Store.prototype.setState = function (state) {
            console.log(_store);
            this._store.next(state);
        };
        Store.prototype.getState = function () {
            return this._store.value;
        };
        Store.prototype.purge = function () {
            this._store.next(defaultState);
        };
        return Store;
    }());
    exports.Store = Store;
});