链接一些RxJS Observable运算符的问题

时间:2016-08-19 12:53:48

标签: angular rxjs observable rxjs5

我正在努力找到最干净的解决方案和运营商,以便链接可观察量。

我的要求如下:

  1. 从路线参数
  2. 中检索userAccountToken
  3. 使用userAcccountToken来对后端进行http调用
  4. 再次使用userAcccountToken以便对后端进行另一次http调用
  5. 最后导航到一条路线(即/dashboard),如果一切都远远超过。
  6. 我的角度2分量如下:

    import {Component, OnInit} from '@angular/core';
    import {UserAccountService} from '../useraccount.service';
    import {ActivatedRoute, Router} from '@angular/router';
    import {SessionService} from '../../session/session.service';
    
    
    @Component({
      templateUrl: 'useraccount-activation.component.html'
    })
    export class UserAccountActivationComponent implements OnInit {
    
      constructor(private userAccountService: UserAccountService,
                  private sessionService: SessionService,
                  private router: Router,
                  private route: ActivatedRoute) {
      }
    
      ngOnInit() {
        this.route.params.map(params => params['userAccountToken'])//1.
          .switchMap(userAccountToken => this.userAccountService.activateAccount(userAccountToken))//2.
          .switchMap(() => this.sessionService.signinByUserAccountToken('???'))//3.
          .subscribe(() => this.router.navigate(['/dashboard']));//4.
      }
    }
    

    问题是我需要在两个地方userAccountToken,但我需要订阅两个http调用,以便它们被执行。

    我可以在2.和3之间执行另一个this.route.params.map(...),但这似乎在重复我自己。

    我可以使用userAccountToken实例变量在组件中引入状态,但是我的函数会创建副作用。

    对于这个问题,什么可以是一个干净的解决方案?

    修改:以下代码:

      ngOnInit() {
        this.route.params.map(params => params['userAccountToken'])
          .mergeMap(userAccountToken => Observable.concatAll(
            this.userAccountService.activateAccount(userAccountToken),
            this.sessionService.signinByUserAccountToken(userAccountToken)
          ))
          .subscribe(() => this.router.navigate(['/dashboard']));
      }
    

    产生以下错误:

    __WEBPACK_IMPORTED_MODULE_4_rxjs_Observable__.Observable.concatAll is not a function
    

    即使我已导入import 'rxjs/add/operator/concatAll';

    编辑2 :我收到上述错误的原因是我在concatAll上使用Observable而不是在Observable类型的实例/对象上使用for node in nodes: print(node.text) 。 ..

1 个答案:

答案 0 :(得分:1)

您可以使用forkJoin假设两个后端调用可以并行完成。如果你必须一个接一个地进行,你可以使用嵌套的mergeMap

const token$ = Rx.Observable.of('token')

token$
  .mergeMap(token => Rx.Observable.forkJoin(
    Rx.Observable.of(token),
    Rx.Observable.of(token)
  ))
  .subscribe(val => console.log(val));
<script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-beta.11/dist/global/Rx.umd.js"></script>

附注:您应该将此功能真正导出到服务中;)