Как я могу получить объект из ngrx-store

Question

Как я могу получить объект из ngrx-store?

Я пытаюсь сделать это

<div class="container">
      <h1>
          {{category$.name}}
      </h1>
</div>

Компонент

export class CatalogViewController {
private routeSubscription: Subscription;
private uri: string;

category$: Observable<any>;

constructor(
    private store: Store<fromRoot.State>,
    private route: ActivatedRoute,
    private router: Router,
    private titleService: Title
) {
    this.routeSubscription = route.params.subscribe(params=>this.uri = params['uri']);
    this.store.dispatch(new catalogActions.LoadCategory({"uri": this.uri}));

    this.category$ = store.select(fromRoot.getCategory);
   }
}

Данные в магазине доступны

Магазин

catalog: {
    category: {
      name: 'Phones',
      uri: 'phones',
      __typename: 'Category'
    }
}

Простая ситуация, но я не могу понять, что я делаю не так: D

Answer 1

Если вы хотите получить доступ к this.category в ваших component.ts, вы должны подписаться на него:

store.select(fromRoot.getCategory).subscribe(state => {
  this.category = state;
});

Таким образом, вы можете использовать его как для ваших component.ts, так и component.html.

Если вы это сделаете, не забудьте отписаться, чтобы предотвратить утечки памяти!

Answer 2

просто сделай

<div class="container">
      <h1>
          {{(category$ | async)?.name}}
      </h1>
</div>