我试图在同一家商店中选择三个州,但我遇到了问题

时间:2018-06-25 10:54:56

标签: angular typescript redux ngrx

我在商店中遇到问题,因为在一个商店中我已经完成了3种状态,正在Angular中使用ngrx商店。 问题是它一切正常,但在TS中出现错误 我已经从@Fartab代码的答案中编辑了问题,该问题正在起作用,但仍然显示一些错误。

这是我到目前为止所做的代码。

  cluster = Map<string, ClusterItem>();

    this.store.select('technicalMatrix').subscribe(state => {
      this.cluster = state.technicalCluster;
      this.manufactures = state.manufacturer;
       this.store.select('technicalMatrix').subscribe(state => {
  this.cluster = ([...state.technicalCluster,
                          ...state.costCenter,
                          ...state.manufacturer]);
});
}

//  this is for the state [ts] Type 'Map<string, ClusterItem>' is not an array type
// for this.cluster it is showing this error
// Only a void function can be called with the 'new' keyword

类型“ any []”中缺少属性“ set”。 这是我的商店。

export interface ApplicationState {
  technicalMatrix: TechnicalMatrixState;
}
export const reducers: ActionReducerMap<ApplicationState> = {

  technicalMatrix: technicalMatrixReducer
};
export interface TechnicalMatrixState {
  costCenter: Map<string, ClusterItem>;
  technicalCluster: Map<string, ClusterItem>;
  manufacturer: Map<string, ClusterItem>;
  activeMatrixType: string;
  expandedTechnicalIds: Set<string>;
  filter: Filter;
}

const INITIAL_STATE = {
  costCenter: Map<string, ClusterItem>(),
  technicalCluster: Map<string, ClusterItem>(),
  manufacturer: Map<string, ClusterItem>(),
  activeMatrixType: '',
  expandedTechnicalIds: Set<string>(),
  filter: {name: ''}
};
import { ApplicationState } from '~/shared/store/reducers';
import { createSelector } from '@ngrx/store';

export const selectClusterItemDatabaseState = (state: ApplicationState) => state.technicalMatrix;
export const selectActiveMatrix = createSelector(selectClusterItemDatabaseState, state => state[state.activeMatrixType]);
export const selectActiveMatrixType = createSelector(selectClusterItemDatabaseState, state => state.activeMatrixType);
export const selectCostCenters = createSelector(selectClusterItemDatabaseState, state => state.costCenter);
export const selectTechnicalClusters = createSelector(selectClusterItemDatabaseState, state => state.technicalCluster);
export const selectManufacturers = createSelector(selectClusterItemDatabaseState, state => state.manufacturer);

我在这里制作了一个方法,以查看商店中可见的商品。

setVisible() {
 this.selectedMatrix.forEach(clusterId => {
      const matrix = this.cluster.get(clusterId); //here is just one store selected this.cluster referes to the store state.technicalCluster
}
}

1 个答案:

答案 0 :(得分:1)

我认为您需要这样的东西:

allClusters: Map<string, ClusterItem>;

this.store.select('technicalMatrix').subscribe(state => {
    this.allClusters = new Map([...state.technicalCluster, 
                                ...state.manufacturer, 
                                ...state.costCenter]);
});


setVisible() {
     this.selectedMatrix.forEach(clusterId => {
         const matrix = this.allClusters.get(clusterId);
     }
}