将多个观察者值作为方法参数传递答案

【问题标题】：Passing multiple observer values as method parameters将多个观察者值作为方法参数传递
【发布时间】：2022-06-29 05:11:13
【问题描述】：

我正在尝试执行以下操作：

this.httpService.createSomething(
    this.userObserver.getFullName().subscribe(),
    this.userObserver.getPhoneNumber().subscribe(),
    this.userObserver.getEmailAddress().subscribe(),
).subscribe(() => console.log('Well done'));

以上内容不起作用，但这是我可以用来描述我正在努力实现的目标的最佳示例

我可以订阅每个 userObserver 方法并将输出值分配给组件属性并将组件属性值传递给 createSomething() 方法，但这看起来很混乱

很高兴在 Angular 模板中我可以使用 (this.userObserver.getFullName()|async) 来查看它的输出值，我希望在方法参数中使用它

这可能吗？

【问题讨论】：

您可能需要在包装 getFullName、getPhoneAddress 和 getEmailAddress 的 combineLatest 上使用 switchMap。一旦 combineLatest 生成的 observable 发出，switch map 将订阅 createSomething

标签： angular rxjs

【解决方案1】：

嗯，有不同的方法来解决这个问题。一种方法是使用zipWith 管道运算符订阅源可观察对象并将其与任意数量的可观察对象输入的值组合。 zipWith 运算符是 RxJS 8 对已弃用的 zip 运算符的替代。你可以做类似的事情：

import { zipWith} from 'rxjs';

private createResult() {
   this.userService.getFullName().pipe(
      zipWith(
        this.userService.getPhoneNumber(),
        this.userService.getEmailAddress()
      ),
      map(([fullName, phoneNumber, emailAddress]) => this.messageService.createSomething(fullName, phoneNumber, emailAddress))
    ).subscribe((result) => console.log(result))
  }

这种方法的好处是您不会将多个订阅相互嵌套，这可能会导致意外的副作用。

【讨论】：