Angular 5 + RxJS：在组件中使用可观察对象而不订阅它们

Question

我通常倾向于在组件中使用 Observables，方法是使用 myFunction(myObservable$ | async) 通过模板将 Observables 传递给函数，并且效果很好。

但是，在我的模板中，我有一个向父组件发出值的输出函数。

<my-component
   [myInput]="something$ | async"
   (childOutputEmitter)="onChildEmitFunction($event)">
</my-component>

问题是 onChildEmitFunction() 函数，我需要结合发出的值（$event）和 myObservable$ | async 值。

虽然这似乎不起作用：

<my-component
   [myInput]="something$ | async"
   (childOutputEmitter)="onChildEmitFunction($event, (myObservable$ | async))">
</my-component>

有没有办法将 myObservable$ 的值传递给 onChildEmitFunction() 而无需订阅它并将值存储在另一个变量中？

Answer 1

您可以使用 *ngIf 指令多次使用来自 observable 的值。

<ng-container *ngIf="something$ | async as something">
  <my-component
     [myInput]="something"
     (childOutputEmitter)="onChildEmitFunction($event, something)">
  </my-component>
</ng-container>

另请注意，如果 async 管道与 HTTP 一起使用，则每个管道都可以触发一个单独的请求。

Angular 5 + RxJS：在组件中使用可观察对象而不订阅它们

Angular 5 + RxJS: using observables in the component without subscribing to them

rxjs

angular

rxjs-observables