CODEWITHSUNDEEP
angularngrx
Drop
Drop

Reputation: 1592

How take state from store? angular/ngrx

i long time work with react/redux and now i trying to learn angular/ngrx.

And I had questions

how write in store? In redux store i just connect used function connect, and in angular i connect like this 

        @Component({   selector: 'home',
            templateUrl: './home.html' }) export class HomeComponent implements OnInit {

            console = console;
            todos$: Observable<any>;
            todo: string;
            todoDate: string;
            indexToEdit: number | null;


            constructor(private store: Store<any>) {}

            ngOnInit() {
                this.todos$ = this.store.select('todoReducer');
            }

next i use todos$ for cycle in template, but if i console.log(todos$) its just object of store, and i can't find my store state, how can I read state from the store?

Upvotes: 1

Views: 1122

Answers (2)

alexKhymenko
alexKhymenko

Reputation: 5608

You can use rxjs operator do to show sideeffects dont forget to import it.

this.todos$ = this.store.select('todoReducer').do(res => console.log(res))

another way will be to subscribe but this will defeat the purpose of ngrx. And you will not use async pipe in template and also you will need to unsubscribe.

storeSub: Subscription;

this.storeSub = this.store.select('todoReducer').subscribe((data) => {
  console.log(data);
  this.todos = data;
})

Upvotes: 1

Benjamin Caure
Benjamin Caure

Reputation: 2403

todo$ is an observable of your state.

You can use it in controller like this:

this.todo$.subscribe(state => console.log(state));

Or in your template like this:

{{ todo$ | async }}
<input type="text" name="myfield" (change)="modifyField($event.target.value)" [value]="(todo$ | async)?.myfield"></input>

Upvotes: 1

Related Questions