Question

ngrx的新手，正在使用angular2seedadvanced.i开发应用程序想在这个应用程序中实现ngrx / store。我指的是

http://bodiddlie.github.io/ng-2-toh-with-ngrx-suite/

代码文件在这里

action.ts

export class HeroActions {
static LOAD_HEROES = '[Hero] Load Heroes';
loadHeroes(): Action {
    return {
        type: HeroActions.LOAD_HEROES
    };
}

static LOAD_HEROES_SUCCESS = '[Hero] Load Heroes Success';
loadHeroesSuccess(heroes): Action {
    return {
        type: HeroActions.LOAD_HEROES_SUCCESS,
        payload: heroes
    };
}
}

reducer.ts

export default function (state = initialState, action: Action): HeroListState {
switch (action.type) {
    case HeroActions.LOAD_HEROES_SUCCESS: {
        return action.payload;
    }
    case HeroActions.ADD_HERO_SUCCESS: {
        return [...state, action.payload];
    }
}

effect.ts

@Injectable()
export class HeroEffects {
constructor (
    private update$: Actions,
    private heroActions: HeroActions,
    private svc: HeroService
) {}

@Effect() loadHeroes$ = this.update$
    .ofType(HeroActions.LOAD_HEROES)
    .switchMap(() => this.svc.getHeroes())
    .map(heroes => this.heroActions.loadHeroesSuccess(heroes));

@Effect() getHero$ = this.update$
    .ofType(HeroActions.GET_HERO)
    .map<string>(action => action.payload)
    .switchMap(id => this.svc.getHero(id))
    .map(hero => this.heroActions.getHeroSuccess(hero));

和我的component.ts

 constructor(){
  this.grocerys$ = store.select('list');// listview binding
  }

  ngOnInit() {
    this.loadItems();
    this.store.dispatch(this.heroActions.loadHeroes());
  };

但是我的列表不会更新。我需要实现的所有其他内容？现在我的输出是

[object Object] //＆lt; ==这里有问题。任何帮助都会非常明显。

如何在angular2中实现ngrx

0 个答案: