app.component.ts

import { Component } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs';

import { ActionTypes } from './store/actions/counter';

@Component({
  selector: 'my-app',
  template: `
  <p>
    NgRx Count: {{ count$ | async }}
    <button (click)="increment()">+</button>
    <button (click)="decrement()">-</button>
  </p>
  `
})
export class AppComponent  {
  public count$: Observable<number> = this.store.pipe(select('count'));
  constructor(private store: Store<{ count: number }>) { }

  public increment(): void {
   this.store.dispatch({ type: ActionTypes.Increment });
  }

  public decrement(): void {
    this.store.dispatch({ type: ActionTypes.Decrement });
  }
}