Angular 6 router.events.filter 'filter' 在类型 'Observable<Event>' 上不存在

Question

我已经完成了将我的应用程序更新到 Angular 6(它是 5.2 版本(。

我在以下方面得到一个错误的语法：

import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
import { filter } from 'rxjs/operators';
...
constructor(private router: Router) {}
this.router.events.filter
(event => event instanceof NavigationEnd).subscribe((res) => 
{
// DO something
});

错误 TS2339：类型上不存在属性"筛选器" "可观察"。

Angular 6 的正确语法是什么？

谢谢

Answer 1

以下是使用 Angular 6+ 和最新的 RxJS 过滤路由器事件的方法：

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, NavigationEnd } from '@angular/router';
import { filter } from 'rxjs/operators';
export class MyComponent implements OnInit {
constructor(private router: Router, private activatedRoute: ActivatedRoute) {}
ngOnInit() {
this.router.events.pipe(
filter(event => event instanceof NavigationEnd)
).subscribe(() => {
console.log(this.activatedRoute.root);
});
}
}

使用pipe运算符，而不是尝试在可观察对象上链接筛选器。

Answer 2

如果您导入了过滤器，我在您的代码中看不到

对于 Rxjs 6：

import { filter } from 'rxjs/operators';
.
.
.
this.router.events.pipe(
filter((event:Event) => event instanceof NavigationEnd)
).subscribe(res => console.log(res))

Answer 3

激活的路由没有给我网址。所以我试了这个。 附言：event['url']工作而不是event.url

import { filter } from 'rxjs/operators';
import { Router,NavigationEnd } from '@angular/router';
router.events.pipe(filter(event => event instanceof NavigationEnd))
.subscribe(event => 
{
this.currentRoute = event['url'];          
console.log(this.currentRoute);
});