Accessing Child Route currentInstruction

Framework Knowledge
1

I’ve had quite a time trying to work with child routes and accessing the currentInstruction object so that I can navigate properly to other child routes. The problem is coming from the fact that I’m injecting the router into the class e.g. import { Router } from 'aurelia-router';. In that view model I’m wanting to navigate to another child route but and was trying to use this.router.navigateToRoute and then trying to grab the this.router.currentNavigation but is always null. I finally fingured out that you need to grab the router object from the route components activate lifecycle method which has the actual current child router object.

I thought I’d share this for anyone having similar issues.

export class MyViewModel {
    activate(params, routeConfig, navigationInstruction){
        this.navigationInstruction = navigationInstruction;
    }

    someMethod(){
        this.navigationInstruction.router.navigateToRoute( this.navigationInstruction.config.name );
    }
}
2 Likes
2

Nice sharing. I think this is an unfortunate state with current router doc, as it doesn’t signify that application routers are like a tree. A router cannot see what route is available inside other branches that is not connected to it in anyway.

In combination with that is navigateToRoute expecting a name, making the above limitation worse because that’s the combo that normally cost folks the most time trying to figure out.

2 Likes