angular - 如何显示reducer的当前状态？

Question

试图了解 angular 2 的 ngrx/store api。我实现了一个简单的计数器减速器：

import {Store} from '@ngrx/store'

export const INCREMENT ='INCREMENT';
export const DECREMENT='DECREMENT';


export const counter = (state = 0, {type, payload}) => {
  switch(type){
    case INCREMENT:
      return state=state+1;
    case DECREMENT:
      return state=state-1;
    default:
      return state;
  }
}

我想显示计数器值：

@Component({
    selector: 'todo-app',
    providers: [],
    template: `
    <div>

    <nextStepButton (next)="prev()"></nextStepButton>

    <nextStepButton (next)="next()"></nextStepButton>

    how to display the counter:{{counter.val}}

    <log-monitor></log-monitor>

  `,
    directives: [LogMonitor, myList, step, nextStepButton, step2],
    changeDetection: ChangeDetectionStrategy.OnPush
})

如何在模板中显示计数器，即减速器值？

github链接：https ://github.com/dimitri-a/ngrx_newtoy

Answer 1

我在这里找到了答案：https ://github.com/ngrx/store 。您必须将 reducer 声明为可观察对象。