NgRX store.select返回存储对象，而不是可观察对象

Question

我写了一个关于Ngrx的简短示例。我不知道为什么这个短代码不能正常运行。

constructor(private store: Store<CounterState>){
this.counter = store.select('counter');
console.log(this.counter);
}

这段代码将Store对象打印到控制台，而不是可观察对象。这很奇怪。该应用程序的完整版本请点击下面的链接。https://stackblitz.com/edit/angular-dq7ssf

Answer 1

在您发布的示例中，您使用定义根状态

StoreModule.forRoot({  counterReducer })

这意味着counterReducer是访问计数器状态的关键，要解决此问题，您可以按以下选择计数器

this.counter = store.select('counterReducer', 'counter');

或者你可以给你的减速器一把钥匙：

StoreModule.forRoot({  counter: counterReducer });
this.counter = store.select('counter', 'counter');

Answer 2

在文章中，当您编写store.select('counter'(时，它将返回一个可观察的值，您将其分配给属性"counter"。现在，"计数器"属性也变成了可观察的。若要从可观测值中检索值，您需要订阅它。下面的代码将解决您的问题。

//Rxjs 5路

this.counter.subscribe(
(data:any) => {
console.log(data) //your data shows here
});

//Rxjs 6路，带管道操作员

this.counter.pipe().subscribe(
(data:any) => {
console.log(data) //your data shows here
});

我希望我的回答能对你有所帮助。

Answer 3

好吧，如果你看一下Ngrx Store Source，Store就是一个Observable！

export class Store<T> extends Observable<T> implements Observer<Action> {
...
}