Auxilary routes are broken

[choeller]

In alpha.44 I don't get aux routes running at all.

creating an aux route with this config

<router-outlet name="side"></router-outlet>

new AuxRoute({path: '/side', component: Settings, as: 'Side'})

always leads to the following exception:

EXCEPTION: TypeError: Cannot read property 'component' of undefined

originating in router.js. The following plnkr demonstrates the error:

http://plnkr.co/edit/Oh5ypPwZVkeQrA1cImEg?p=preview

[brandonroberts]

@choeller Correct. There is no way currently to generate urls for auxiliary routes, but to get your example working you need to use.

router.navigateByUrl('/guestbook(side)');

[choeller]

@brandonroberts

Ok thank you! So I think there are 2 problems

1.) It is not possible to create the link

2.) It is not possible to link to guestbook without passing the aux-route - or am I getting the concept wrong? In my understanding the aux-route part has to be optional - otherwise I could just put the content from the aux-route in the template.

I'm not sure if this is the right place for this discussion - but I also have some problems understanding the concept at all. When I say

<router-outlet name="side"></router-outlet>

and in config

new AuxRoute({path: '/side', component: Settings, as: 'Side'})

then the whole config is totally static: In the sidebar I will always see the settings dialog. I would assume that I have an aux-route where I can load different templates. Can you shed some light on that?

[thelgevold]

I ran into the same problem with the aux route not being optional.

[brandonroberts]

@choeller Yea, I think that's a bug also. If you have a named outlet, currently you have to populate the auxiliary route also or it throws an error.

[zoechi]

Seems to be fixed.

[jmsegrev]

I'm having similar issue with the auxiliary routes, I can access them by using the router navigate(), but when trying to access directly from the url path, it throws this exception:
EXCEPTION: TypeError: Cannot read property 'child' of null

I'm using beta.2.

[choeller]

@jmsegrev Yes - this is what I experience too. Seems my original problem is fixed, but when having an aux-route open reloading the page leads to

TypeError: Cannot read property 'child' of null
    at http://localhost:4200/vendor/angular2/bundles/router.dev.js:549:33

[thelgevold]

I have also seen the "TypeError: Cannot read property 'child' of null", but it seems to only happen if I try to define an aux route for a child route. If the aux route is at the root level it seems to work.

#/root(message) //works

#/root/child(message) //Gives me TypeError: Cannot read property 'child' of null

However, I have noticed that when I activate the aux route it rewrites all other links on the page to also contain the (aux) parameter. It might be due to a configuration issue on my end, but the only way to "defeat" the aux route is to manually remove it from the url or do a redirect from code.

[brandonroberts]

@thelgevold @choeller currently aux routes work on either root level routes /root(message) or without a root level route at all /(message). The way the aux routes are working is by design as they are intended to remain active even if you visit a router link that doesn't specifically have an aux route in its array.

[thelgevold]

@brandonroberts Ok thanks for the explanation. One question though. If they remain active on other routes than the activating route, how do you remove the aux part if you want to navigate to a section where it's not wanted?

[brandonroberts]

@thelgevold good question. I don't know of a way to do it outside of "defeating" it. Like you said you have to navigate from code, or you could use a regular href with the aux route in it but either way you're working around the system.

I think the main issue is that we want aux routes to work like named ui-views in ui-router, but that's not there intent as I understand it. They are suppose to work independently of your "normal" routes instead of in addition to them.

[thelgevold]

Yeah, I have open questions around this as well.
Started a new issue related to this here: #7073

[choeller]

@brandonroberts Thanks for the info. So I'm still not sure if the

TypeError: Cannot read property 'child' of null

Error is because of a bad config on my side, or if it's a bug - I tried to create the aux-route in the RouteConfig of a nested route. It get's activated correctly, but causes the error on reload. Did you experience the same?

So I have
Main-Component

@RouteConfig([
    {path: '/', component: Dashboard, name: 'Dashboard'},
    {path: '/tasks/...', component: Tasks, name: 'Tasks'},
    {path: '/newtask', component: EditTask, name: 'NewTask', useAsDefault : true},
    {path: '/settings', component: Settings, name: 'Settings'}
])

Task-Component

@RouteConfig([
    {path: '/list', component: TaskList, name: 'List', useAsDefault: true},
    {path: '/edit/:id', component: EditTask, name: 'EditTask'},
    {path: '/new', component: EditTask, name: 'NewTask'},
    {aux: 'side', component: TaskOverview, name: 'Side'}
])

and the route like this:

<a [routerLink]="['../List', [ 'Side', {id: task.id}]]">Show Overview</a>

[brandonroberts]

@choeller Yep, I've seen the same thing. I think its a combination of both. Aux routes are only supported on root level route configs, so you'd need to move {aux: 'side', component: TaskOverview, name: 'Side'} to your Main-Component, then it should work on reload and navigation.

I've also seen that even with your aux route in the root level route config, if you navigate to a nested route, the aux routes are carried over, but on refresh the aux routes are dropped.

Here is my plunker with some Aux Routes: http://plnkr.co/edit/5mp8pXsWuLt2yAIQgV3p?p=preview

[IgorMinar]

This issue was made obsolete by router v3: https://angularjs.blogspot.com/2016/06/improvements-coming-for-routing-in.html

If you believe this is not the case, please file a new issue updating the description to router v3. thank you!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}