首页 文章

带角度路由器的RXJS - 'mergeMap'不是一个功能

提问于
浏览
6

我使用角度路由器和RxJS时遇到问题 . 角度4.3.6和RxJS 5.2.0一切正常 .

但是当我升级到:

角度:5.0.3
RxJS:5.5.2

我开始在我的应用程序中的不同位置出现奇怪的错误 . 例如,看看这段代码 .

注意:我已经导入了'mergeMap'函数,如您所见 . 而且我也没有得到Observable类型的“bla”变量的错误,只是对于Router.events,它本身就是一个Observable .

任何想法如何解决问题?

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/mergeMap';
import {Component, OnInit, ViewEncapsulation} from '@angular/core';
import {ActivatedRoute, NavigationEnd, Router} from '@angular/router';

@Component({
  selector: 'pv-app',
  encapsulation: ViewEncapsulation.None,
  template: `
        ....
  `
})

export class PvComponent implements OnInit {

  constructor(private router: Router,
              private activatedRoute: ActivatedRoute) {
  }

  ngOnInit() {
   let bla = Observable.of('hello');
   bla.mergeMap(x=>x); // Works without problems.

   this.router.events
      .filter((event) => event instanceof NavigationEnd)
      .map(() => this.activatedRoute)
      .map((route) => {
        while (route.firstChild) {
          route = route.firstChild
        };
        return route;
      })
      .filter((route) => route.outlet === 'primary')
      .mergeMap((route) => route.data)
      .subscribe((event) => {
          // not relevant
        });
      };
}

我在控制台上收到以下错误 .

PvComponent_Host.ngfactory.js:5 ERROR TypeError: 

this.router.events.filter(...).map(...).map(...).filter(...).mergeMap is not a function
    at PvComponent.ngOnInit (pv.component.ts:41)
    at checkAndUpdateDirectiveInline (core.js:12291)
    at checkAndUpdateNodeInline (core.js:13794)
    at checkAndUpdateNode (core.js:13737)
    at debugCheckAndUpdateNode (core.js:14609)
    at debugCheckDirectivesFn (core.js:14550)
    at Object.eval [as updateDirectives] (PvComponent_Host.ngfactory.js:9)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:14535)
    at checkAndUpdateView (core.js:13704)
    at callWithDebugContext (core.js:14936)
    at Object.debugCheckAndUpdateView [as checkAndUpdateView] (core.js:14473)
    at ViewRef_.detectChanges (core.js:11496)
    at eval (core.js:5982)
    at Array.forEach (<anonymous>)
    at ApplicationRef.tick (core.js:5982)

谢谢,丹尼尔

1 回答

  • 10

    添加这个:

    import 'rxjs/add/operator/mergeMap';
    

相关问题