我可以通过以下方式订阅 RXJS observable 吗？

Question

在我的 Angular 组件中，我想订阅很多选择器，为了减少样板，我尝试通过以下方式订阅：

this.store.select(selectFilloutId)
          .subscribe(filloutId => this.filloutId=filloutId);

它似乎按我想要的方式工作，我的组件中的 filloutId 获得了正确的值，但我不完全确定没有我看不到的不需要的副作用。

我的问题是：这是一个好方法，还是我应该完全避免这样做？

提前致谢！

Answer 1

只要您在某个时候取消订阅，该方法就没有任何问题。如果您不取消订阅，一个不想要的副作用是，在您完成订阅后，您将拥有旧订阅。这最终可能会导致内存泄漏。

如果您使用从该特定选择器返回的值在模板中显示某些内容，我会在模板中订阅它。这将为您管理订阅生命周期，我认为这比手动订阅要好。如果可以避免的话，我宁愿不手动订阅。

<ng-container *ngIf="fillOutId$ | async; let fillOutId"></ng-container>

如果您依赖fillOutId$ 执行其他异步操作，我会使用管道。例如，如果你想得到一个基于fillOutId$的东西的列表：

list$ = this.fillOutId$.pipe(
// map, switchMap, whatever you need to do here
)

然后，在模板中订阅这个：

<ng-container *ngFor="let item of list$ | async; let item">
   <a-component-with-list-item-as-input 
      [item]="item"
   ></a-component-with-list-item-as-input>
</ng-container>

---

顺便说一句，ngrx 有一个名为 @ngrx/component 的库，它可以让您将上述内容写成：

<ng-container *ngrxLet="fillOutId$; let fillOutId"></ng-container>

这将允许您订阅 observable，但如果值为 falsy，则不会阻止渲染。