0

After a user tried to help with an issue regarding that post: My stackoverflow old post I am now trying to implement the Ngrx store using Ngrx store github to help me solve multiples input/output event.

Just after my constructor I have an error:

counter is not assignable to parameter of type (state: Appstate) => boolean:

child.ts:

import { Component, Input, Output, EventEmitter } from '@angular/core';
import { UserService3 } from '../user3.service';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
import { ON, OFF, RESET } from '../counter';

interface AppState {
  counter: boolean;
}

@Component({
  selector: 'my-daydetail',
  templateUrl: './my-daydetail.component.html',
  styleUrls: ['./my-daydetail.component.css']
})
export class MyDaydetailComponent  {

  counter: Observable<boolean>;

  constructor(private store: Store<AppState>) {
    this.counter = store.select('counter');
  }

  //...
}

counter.ts

import { Action } from '@ngrx/store';

export const ON = 'ON';
export const OFF = 'OFF';
export const RESET = 'RESET';

export function counterReducer(state: boolean = true, action: Action) {
  switch (action.type) {
  case ON:
    return false;

  case OFF:
    return true;

  case RESET:
    return 0;

  default:
    return state;
}

}

Emile Cantero
  • 1,943
  • 3
  • 22
  • 47
  • @PierreDuc maybe should I use `feature` instead? – Emile Cantero Jul 25 '17 at 13:10
  • you are doing it wrong right increment decrement can be used in boolean type right – Rahul Singh Jul 25 '17 at 13:16
  • @RahulSingh thinks I gotcha look my updated post following your instructions, I think I implemented right :-) , now how could nGrx help me with my issues from the old post? – Emile Cantero Jul 25 '17 at 14:15
  • 1
    As counter is an observable ypu can subscribe to it in the component and where ever the value changes you will get notified by that subscription when wver you enter value to the store – Rahul Singh Jul 25 '17 at 14:20
  • @RahulSingh so I tried to implent like so: @Input() hideMePartially: boolean; it works with any error but i can't realise the benefits – Emile Cantero Jul 25 '17 at 15:19
  • did you go through that question in that link i mentioned a example in that question why ngrx . that will make it clear . now if you app is small it will seem to you like extra code but later you will reap the benifits in testing and maintaining – Rahul Singh Jul 25 '17 at 15:51
  • @RahulSingh thanks for your help but I am almost at the end of the project so I think I don't need Ngrx for this one, maybe the next.. – Emile Cantero Jul 26 '17 at 09:09
  • yes that is the reason i mentioned you could even go for shared services instead of ngrx – Rahul Singh Jul 26 '17 at 09:13

1 Answers1

1

You have set the initial state to false in your reducer. Make it any and initialize it with empty object. Also in your switch case for ON/OFF/RESET etc. you have to return immutable state like below:

return {...state, counter:true/false/0}
Shivang Gupta
  • 3,139
  • 1
  • 25
  • 24