angular - 仅订阅 ngrx 商店的一部分

Question

让我的 Ionic/Angular 应用程序中的组件订阅@ngrx 商店的部分时遇到了很多麻烦。

在我的应用程序中，我有一个 index.ts 文件，其中包含:

import * as fromReducer1 from './reducer1';
import * as fromReducer2 from './reducer2';

export interface ApplicationState {
  reducer1: fromReducer1.Reducer1State;
  reducer2: fromReducer2.Reducer2State;
}

在 reducer1 中我有:

export interface Reducer1State {
  products {
   items: any[],
   prices: any[]
  },
  filters: any[]
}

和导出函数

export function Reducer1 etc 

在我的组件中，我可以通过这样做愉快地订阅 Reducer 1:

this.store.select('Reducer1')
      .subscribe((store: any) => {})

这工作正常，但我想要做的是让我的组件订阅 Reducer1，但仅获取对 Products 对象的更改，即如果过滤器对象发生更改，那么我对此不感兴趣。或者至少当组件订阅时，它可以检测产品对象是否与上次相同，即使用 DistinctUntilChanged(虽然我无法让它工作)

我该怎么做(我已经搜索并尝试了几件事，但都没有成功)。谢谢!

Answer 1

你可以写内部选择器

// take the whole state reducer
export const reducer2State= (state: State) => state.transactions;
//take inner reducer 
export const getInnerState = createSelector(reducer2State, 
        fromReducer2.something);
// select in component
this.innerReducer = this.store.select(fromRoot.getInnerState );

如果您使用的是 ngrx2，请查看此 example app .如果您使用的是 ngrx4，请查看此 example app