Question

如何从ngrx商店获取对象？

我正在尝试这样做

<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

只要

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

Answer 2

如果要在component.ts中访问this.category，则必须订阅它：

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

这样，您就可以在component.ts和component.html上使用它。

如果要执行此操作，请不要忘记取消订阅，以防止内存泄漏！

如何从ngrx-store获取对象

2 个答案: