X-Git-Url: https://juplo.de/gitweb/?a=blobdiff_plain;f=src%2Fapp%2Fvorgang%2Fvorgang.component.ts;h=8324ca002383574e56a4b70d6a99bc2e1d6e0341;hb=a232212e2aff197d3aea92194f83f76a241c3559;hp=4c8233dbab3777744738088b7c6255b104bb7859;hpb=19c4e709fac3a3b73f4bc2cdbebe0f1319195728;p=examples%2Fangular-tour-of-heroes diff --git a/src/app/vorgang/vorgang.component.ts b/src/app/vorgang/vorgang.component.ts index 4c8233d..8324ca0 100644 --- a/src/app/vorgang/vorgang.component.ts +++ b/src/app/vorgang/vorgang.component.ts @@ -1,4 +1,9 @@ import { Component, OnInit } from '@angular/core'; +import { Store, select } from '@ngrx/store'; +import { Observable } from 'rxjs'; +import { State } from '../reducers/vorgang'; +import { increment, decrement, reset } from '../actions/vorgang'; +import { map } from 'rxjs/operators'; @Component({ selector: 'app-vorgang', @@ -7,9 +12,24 @@ import { Component, OnInit } from '@angular/core'; }) export class VorgangComponent implements OnInit { - constructor() { } + vorgang$: Observable; + + constructor(private store: Store<{ vorgang: State }>) { + this.vorgang$ = store.pipe(select('vorgang'), map(vorgang => vorgang.counter)); + } ngOnInit(): void { } + increment() { + this.store.dispatch(increment()); + } + + decrement() { + this.store.dispatch(decrement()); + } + + reset() { + this.store.dispatch(reset()); + } }