Angular ngrx 4选择器返回整个状态而不是子状态

出于某种原因，我所有的选择器都返回整个状态对象，而不是我认为应该返回的子状态。例如，我试图从reducers/customer.ts返回customer状态，但是我从index.ts获得一个包含整个状态的对象

在检查github的ngrx示例应用程序后，我选择了下面的特定结构，显然我做错了什么

文件结构：

以下是actions/customer.ts：

import { Action } from '@ngrx/store';
import { State } from '../reducers/customer';

export enum CustomerActionTypes {
  Add = '[Customer] Add Selected Customer to Store'
}

export class Add implements Action {
  readonly type = CustomerActionTypes.Add;
  constructor(public payload: State) {
    console.log("from action: " + JSON.stringify(payload,null,2));
  }
}

export type CustomerActions = Add

和减速器/客户。ts：

import { ActionReducer, Action } from '@ngrx/store';
import { CustomerActionTypes, CustomerActions } from '../actions/customer';

export interface State {
  name: string;
  status: string;
  phone: string;
  stage: string;
  type: string;
  id: string;
  street: string;
  city: string;
  postalCode: string;
  email: string;
  state: string;
}

export function reducer(
  state: State,
  action: CustomerActions
): State {
  switch (action.type) {
    case CustomerActionTypes.Add:
      return action.payload

    default:
      return state;
  }
}

export const getCustomerState = (state: State) => state;

和减速器/index.ts：

//For reducers map
import * as fromMainNav from './main-nav-ui';
import * as fromTradeUI from './trade-ui';
import * as fromAppts from './appointments';
import * as fromCustomer from './customer';


//Whole application state
export interface State {
  mainNavUI: fromMainNav.State;
  tradeUI: fromTradeUI.State;
  appointments: fromAppts.State;
  selectedCustomer: fromCustomer.State;
}

//Reducer map
export const reducers = {
  mainNavUI: fromMainNav.reducer,
  tradeUI: fromTradeUI.reducer,
  appointments: fromAppts.reducer,
  selectedCustomer: fromCustomer.reducer
};

并在app.module.ts中导入：

imports: [
    ...
    StoreModule.forRoot(reducers)
  ],

最后，我是如何将其连接到组件中并使用选择器的：

...
import * as fromCustomer from '../../../shared/state/reducers/customer';
...

public cust$: Observable<fromCustomer.State>;

constructor(
    ...
    public ngrxStore: Store<fromCustomer.State>
  ) {
      this.cust$ = ngrxStore.select(fromCustomer.getCustomerState);
    }

。。。
从“../../../shared/state/reducers/customer”以客户身份导入*；
...
公共客户美元：可观察的；
建造师(
...
公共ngrxStore:存储
) {
this.cust$=ngrxStore.select（fromcuster.getCustomerState）；
}

任何帮助都将不胜感激，谢谢

尝试使用内部

减速器/index.ts

从顶级功能状态开始：

export const getAppState = createFeatureSelector<State>('wholeApp');

从那里，您可以通过链接选择器继续深入您的状态，例如，如果您的组件只需要了解客户的电子邮件地址，它可以订阅以下内容：

export const getEmail = createSelector(
   getCustomer,
   (state: fromCustomer.State) => state.email
);

有关更多详细信息（和示例），我建议查看托德格言的这篇伟大文章：

---

Salem为您提供了一个很好的解决方案，但问题的根本原因是应用程序组件中的这一行

this.cust$=ngrxStore.select（fromcuster.getCustomerState）

您的fromCustomer.getCustomerState定义如下：

export const getCustomerState=（state:state）=>state

由于ngrxStore.select将始终返回根状态，当然，您仍将根据定义此getCustomerState函数的方式获取根状态。getCustomerState函数不进行任何转换，只返回传递的任何内容。
非常感谢，这很有意义。我刚刚把它们都移到索引中作为解决办法，但我更喜欢这种方法。你能解释一下“wholeApp”字符串是从哪里来的吗？谢谢。@eternal初学者这是您给您所在州起的名字，它可以是像
产品
或
比萨饼
或只是
应用程序
这样的模块。我刚刚添加了一个链接到一篇伟大的文章，更好地解释了它。
export const getEmail = createSelector(
   getCustomer,
   (state: fromCustomer.State) => state.email
);