2017-02-26 57 views
3

我下面的例子中,應用程序(https://github.com/ngrx/example-app),我所有的商店,效果,動作偉大的工作,但我使用的定義在減速文件VS選擇定義選擇時越來越怪異行爲在容器文件中。在reducer文件中定義的選擇器返回該函數,而在容器文件中定義的選擇器返回該對象。我已經複製了代碼片段來詳細解釋這一點。我想定義共享選擇器,因此很容易進行維護和升級,而不是每次在容器組件中定義。如果有人解決這個問題,我會很感激。NGRX /存儲選擇收益函數,而不是對象

//package.json

{ 
    dependencies: { 
     "@angular/common": "2.2.1", 
     "@angular/compiler": "2.2.1", 
     "@angular/compiler-cli": "2.2.1", 
     "@angular/core": "2.2.1", 
     "@angular/forms": "2.2.1", 
     "rxjs": "^5.0.0-beta.12",   

     "@ngrx/core": "^1.2.0", 
     "@ngrx/effects": "^2.0.0", 
     "@ngrx/store": "^2.2.1", 
     "@ngrx/store-devtools": "^3.2.3", 
     "reselect": "^2.5.4"   
     .... 
    }, 
} 

//space.reducer.ts //空間接口和減速器

export interface SpaceState { 
    lastUpdated?: Date, 

    spacesLoaded: boolean, 
    spaces: {[key: string]: Space} 
} 

export const INITIAL_STATE: SpaceState = { 
    lastUpdated: new Date(), 

    spacesLoaded: false, 
    spaces: {}, 
}; 

export const getMap = (state: SpaceState) => state.spaces; 

//application.reducer.ts //組成狀態接口和還原劑

import * as fromSpace from "./space.reducer.ts"; 

export interface ApplicationState{ 
    spaceState: SpaceState 
} 

export const INITIAL_APPLICATION_STATE: ApplicationState = { 
    spaceState: fromSpace.INITIAL_STATE 
}; 

const reducers = { 
    spaceState: fromSpace.reducer 
}; 

const reducer: ActionReducer<ApplicationState> = combineReducers(reducers); 

export function reducer(state: any, action: any) { 
    return reducers; 
} 

export const getSpaceState = (state: ApplicationState) => state.spaceState; 
export const getSpaceMap = (state: ApplicationState) => createSelector(getSpaceState, fromSpace.getMap); 

//spaces.container.ts //容器組件

export class SpacesComponent implement onInit() { 
    constructor(private store: Store<ApplicationState>) {} 

    ngOnInit(): void { 
     this.store.select(getSpaceMap).subscribe(map => { 
      console.log("subscribe of space-map (using shared func) from container: " + map); 
     }); 

     this.store.select((state) => state.spaceState.spaces).subscribe(map => { 
      console.log("subscribe of space-map (using container func) from container: " + map); 
     }); 
    } 
} 

//從容器輸出

subscribe of space-map (using shared func) from container: function selector(state, props) { 
     for (var _len4 = arguments.length, args = Array(_len4 > 2 ? _len4 - 2 : 0), _key4 = 2; _key4 < _len4; _key4++) { 
     args[_key4 - 2] = arguments[_key4]; 
     } 

     var params = dependencies.map(function (dependency) { 
     return dependency.apply(undefined, [state, props].concat(args)); 
     }); 
     return memoizedResultFunc.apply(undefined, _toConsumableArray(params)); 
    } 

subscribe of space-map (using container func) from container: [object Object] 

回答

3

你打電話似乎是重新選擇的createSelectorgetSpaceMap選擇和你正在返回它的結果,這就是爲什麼它正在返回一個函數。您的選擇器正在返回其他選擇器

相反,你應該分配的createSelectorgetSpaceMap結果:

export const getSpaceMap = createSelector(getSpaceState, fromSpace.getMap); 
+0

非常感謝你,它可以幫助和解決的問題。我的不好剪切和粘貼導致這個問題:( – skuppa

相關問題