Angular 6 router.events.filter 'filter' не существует для типа 'Observable ‹Event›'

Я закончил обновлять свое приложение до 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?

Благодарность


typescript angular rxjs rxjs6 angular6
person Anouar Mokhtari    schedule 15.05.2018    source источник
comment
импортировать 'rxjs / добавить / оператор / фильтр'   -  person Roberto Zvjerković    schedule 15.05.2018
comment
Я использую RXJS 6: импорт {фильтр} из 'rxjs / operator';   -  person Anouar Mokhtari    schedule 30.07.2018

Ответы (3)


arrow_upward
116
arrow_downward

Вот как фильтровать события маршрутизатора с помощью 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 вместо попытки связать фильтр по наблюдаемому.

person Lansana Camara    schedule 15.05.2018
comment
Это работает для RxjS 6 с новым обязательным операторским каналом. Для RxJS 5 вы можете обратиться к комментарию @ ritaj: import 'rxjs / add / operator / filter' - person Phuc Thai; 20.07.2018
comment
Спасибо за решение @Lansana! Я перешел на 6, и моя служба перестала работать. - person Andrew Lobban; 27.08.2018
comment
Подскажите, пожалуйста, как получить доступ к свойству url этого события, я не могу получить к нему доступ - person Hope; 09.09.2020
comment
@ Надежда Попробуйте console.log(...) на объекте события и посмотрите, к каким свойствам у вас есть доступ. - person Lansana Camara; 10.09.2020

arrow_upward
5
arrow_downward

Я не вижу в вашем коде, если вы импортировали фильтр

для Rxjs 6:

import { filter } from 'rxjs/operators';

    .
    .
    .

     this.router.events.pipe(
       filter((event:Event) => event instanceof NavigationEnd)
     ).subscribe(res => console.log(res))
person devpato    schedule 15.05.2018

arrow_upward
0
arrow_downward

Активированный маршрут не давал мне URL. Итак, я попробовал это. P.S: вместо event.url работало событие ['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);
         });
person Rincy Philip    schedule 18.10.2020