2017-10-17 157 views
5

怪異的行爲正如標題所說,我現在面臨一個問題,我的所有效果只有在這些情況下正常工作:我已經登錄 NGRX - 上影響

    • m沒有登錄

    如果我設法註銷並與其他用戶登錄,則會出現問題。只有每個ngOnInit做動作調度纔會被調用。沒有效果被解僱。

    我有兩個模塊,app.modulepages.module。第一個聲明只有組件沒有登錄的用戶,如login/register/reset。第二個只聲明登錄用戶的組件。

    app.module.ts我導入所有reducer並將其設置爲StoreModule.provideStore(reducer)。在另一個模塊pages.module.ts中,我導入並激活了諸如EffectsModule.run(TestEffects)的效果。

    使用以下代碼只會調用ngOnInit內部的日誌。效果內的日誌永遠不會被調用。

    test.component.ts

    /** ngrx **/ 
    import * as reducers from '../../reducers'; 
    import * as testActions from './actions/test.actions'; 
    
    . . . 
    
    constructor(private _store: Store<reducers.State>){ 
        this._store.select(reducers.getStuff) 
         .subscribe(stuff => console.log(stuff)); 
    } 
    
    ngOnInit() { 
        console.log('Dispatching Load Action'); 
        this._store.dispatch(new testActions.LoadAction()); 
    } 
    

    test.actions.ts

    import { Action } from '@ngrx/store'; 
    
    export const ActionTypes = { 
        LOAD: type('[Test] Load'), 
        LOAD_SUCCESS: type('[Test] Load Success'), 
    }; 
    
    export class LoadAction implements Action { 
        type = ActionTypes.LOAD; 
        constructor() {} 
    } 
    
    export class LoadActionSuccess implements Action { 
        type = ActionTypes.LOAD_SUCCESS; 
        constructor(public payload: SomeType) {} 
    } 
    
    export type Actions 
        = LoadAction 
        | LoadActionSuccess 
    

    test.effects.ts

    @Injectable() 
    export class TestEffects { 
        @Effect() load$ = this.actions$ 
        .ofType(testActions.ActionTypes.LOAD) 
        .map(toPayload) 
        .switchMap(() => this._testService.getStuff() 
         .map(result => new testActions.LoadActionSuccess(result)) 
         .catch((error) => Observable.of({type: error})) 
        ) 
        ; 
    
        constructor(private _testService: TestService, private actions$: Actions) {} 
    } 
    

    test.service.ts

    import { createSelector } from 'reselect'; 
    import { Action } from '@ngrx/store'; 
    /** ngrx **/ 
    import * as sidebarActions from '../actions/test.actions'; 
    
    export interface State { 
        stuff: SomeType 
    }; 
    
    export const initialState: State = { 
        stuff: new SomeType() 
    }; 
    
    export function testReducer(state = initialState, action: Action): State { 
        switch (action.type) { 
         case testActions.ActionTypes.LOAD_SUCCESS: 
          return { 
           stuff: new SomeType(action.payload) 
          } 
         default: { 
          return state; 
         } 
        } 
    } 
    
    export const getStuff = (state: State) => state.stuff; 
    

    在我的package.json我:

    { 
        "dependencies" : { 
         "@angular/core": "^4.0.0", 
         . . ., 
         "@ngrx/core": "^1.2.0", 
         "@ngrx/effects": "^2.0.4", 
         "@ngrx/store": "^2.2.3", 
         . . . 
        }, 
        "devDependencies" : { 
         . . . 
         "ngrx-store-freeze": "^0.1.9", 
         . . . 
        } 
    } 
    

    我真的不理解這種行爲。我也採取了對ngrx github問題和相關問題如this one的戰利品,但我真的不能解決這個問題。

    我猜它可能的事實,我有這兩個 不同的模塊引起

    編輯

    移動內部app.module的影響,他們的服務導致相同的行爲。

    我在做什麼錯?

  • +0

    不是你的問題的解決方案,但你有沒有考慮將ngrx/store更新到版本4? –

    +0

    嗨@Daniel B,是的,但我有一些問題必然會出現在角度版本上。將角度5出來時更新它。 – AndreaM16

    +1

    好的,我會看看我是否可以重現您的問題! –

    回答

    0

    它出來的問題是由舊版本ngrx引起的。我設法將所有內容升級到版本4.1.1之後的migration guide和README中的不同說明。