Question

在一个组件中，我正在订阅路由器事件＆＃39; NavigationEnd＆＃39;在＆＃39; ngOnInit＆＃39;如下：

public ngOnInit(): void {
this.router.events
  .filter((e: {}) => e instanceof NavigationEnd)
  .subscribe((event: {}) => {           
    this.myFunction();
  });
}

除了上面的代码，我在另一个组件中使用router.navigate（[link]），如下所示：

constructor(private router: Router) {}

public navigateToLink = (link: string): void => {
 this.router.navigate([link]);
}

它在Chrome中运行良好，但是，在评论路由器事件订阅代码，路由器导航开始在Firefox中工作后，导航在Firefox中根本不起作用。请指导我的代码有什么问题。

Answer 1

我不知道为什么它在firefox中不起作用，但是我在NavigationEnd中使用路由器事件，这就是我控制它的方式。

navigation: any;
navigationId: any;
this.routerEvents = _router.events
    .filter((event) => event instanceof NavigationEnd)
    .subscribe((val: Event) => {

        this.navigation = val;
        var currentRoute = this._router.url;
        if (val instanceof NavigationEnd && (this.navigationId === undefined || this.navigationId !== this.navigation.id)) {
            this.navigationId = this.navigation.id;
            //do the thing here
        }
    });

这里我正在检查路由器事件是否多次被调用如果我继续访问此组件，事件将事件存储在堆栈中，所以我只调用内部代码一次。

同时取消订阅目标

上的活动

ngOnDestroy() {
        if(this.routerEvents){
            this.routerEvents.unsubscribe();
        }
    }

Angular4路由器事件NavigationEnd在Firefox中停止导航

1 个答案: