Question

我想知道在使用角度路由器导航到不同的“视图”之后是否有办法执行某些操作。

this.router.navigate(["/search", "1", ""]);
// Everything after navigate does not not get executed.
this.sideFiltersService.discoverFilter(category);

Answer 1

this.router.navigate返回一个promise，所以你只需使用：

this.router.navigate(["/search", "1", ""]).then(()=>{
  // do whatever you need after navigation succeeds
});

Answer 2

不完全确定上下文，但选项是使用ActivatedRoute

订阅网址更改

https://angular.io/docs/ts/latest/guide/router.html#!#activated-route

以下是一个例子：

...
import { ActivatedRoute } from '@angular/router';
...

private _routerSubscription: any;

// Some class or service

constructor(private _route: ActivatedRoute){
    this._routerSubscription = this._route.url.subscribe(url => {
        // Your action/function will go here
    });
}

如果网址不是您所需要的，那么您可以在ActivatedRoute中订阅许多其他可观察对象，这些可观察对象列在该链接中。

订阅可以在constructor()或ngOnInit()中完成，具体取决于您最适合的方式，只需记住自己清理并取消订阅ngOnDestroy()：）

this._routerSubscription.unsubscribe();

Answer 3

如果您从ComponentA导航到ComponentB，那么在导航后，您可以在ngOnInit() ComponentB函数中执行任何操作，具体取决于路径中传递的参数。

Answer 4

// In javascript
this.router.navigate(["/search", "1", ""])
    .then(succeeded => {
        if(succeeded)
        {
            // Do your stuff
        }
        else
        {
            // Do some other stuff
        }
    })
    .catch(error => {
        // Handle the error
    });

// In typescript you can use the javascript example as well.
// But you can also do:
try
{
    let succeeded = await this.router.navigate(["/search", "1", ""]);
    if(succeeded)
    {
        // Do your stuff
    }
    else
    {
        // Do some other stuff
    }
}
catch(error)
{
    // Handle the error
}

Answer 5

您还必须确保没有正在进行的订阅...我遇到了同样的问题，在我的情况下，有一个订阅更改了路由。因此路线已更改两次。但实际上您可以使用诺言，没错

在Angular2中执行router.navigate之后的代码

5 个答案: