Get object from angular observable ngrx/store

Question

I have a problem getting an object from the @ngrx/store. This code worked fine for a long time, but now it seems to be broken and I don't know why.

The object to store has this structure:

export class UserInfo {
  user: string;
  token: string;
  permissions: string[];
}

This function saves my object to the store:

saveUserInfo(userInfo: UserInfo) {
    this.store.dispatch(new UserInfoActions.Save(userInfo));
}

Now when I try to get the object back from the store like this:

userInfoStore$: Observable<UserInfo>;
constructor(private store: Store<AppState>) {
    this.userInfoStore$ = this.store.select('userInfo').subscribe(user => {
      console.log(user)
    });
}

The desired output is something like

{user: "username", token: "token", permissions: []}

But the output is:

{0: "{", 1: "\"", 2: "u", 3: "s", 4: "e", 5: "r", 6: "\"", 7: ":", 8: "\"", 9: "u", 10: "s", 11: "e", 12: "r", 13: "n", 14: "a", 15: "m", ...}

What is going on here? Has something changed how observables work?

Angular v9.1.0 @ngrx/store v9.0.0

Answer 1

The reason behind this is your reducer is returning stringified userInfo . check the userInfo that you are receiving from API and the reducer where you are returning the userInfo from.