我是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
任何人都可以帮助我。此外,如果我想要做的是为我的模型对象创建一个商店,所以如果有任何其他更简单的方法随时建议它。
感谢任何帮助。
答案 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)
您实际上必须导入所有运营商(即do
和distinctUntilChanged
)以及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;
});