router: Repeat.for doesn't rebind when switching routes in a child router

This is based on the latest aurelia version as of 11-10

Here is my child viewmodel

export class ChildView {

constructor() {
}

configureRouter(config, router) {
    config.map([           
        { route: ['','route1'], name: 'route1', moduleId: 'views/configuration/route1/index', nav: true, auth: true, title: 'General'},            
        { route: ['route2','route2'], name: 'route2', moduleId: 'views/configuration/route2/index', nav: true, title: 'Communication'},            
    ]);
    this.router = router;
}

activate() {

}

}

Here is my view

<template>

<ul>
    <li repeat.for="item of router.navigation"><a href.bind="item.href">${item.title}</a></li>
</ul>

<router-view></router-view>
</section> </template>

When i first load the page it works perfectly, if i switch to route2, the repeat.for doesn’t rebind leaving me with no links to navigate back and forth.

The same thing happens with any repeat.for , i created a simple string array and this didn’t either rebind.

About this issue

  • Original URL
  • State: closed
  • Created 9 years ago
  • Comments: 29 (15 by maintainers)

Commits related to this issue

Most upvoted comments

i use following way to fix:

   activate(params, routeConfig, navigationInstruction) {

        this.router.parent.currentInstruction = navigationInstruction;

        // fix bug for second router's navigation href not refresh when parent router changed.
        _.each(this.router.navigation, (current) => {
            current.href = '';
        });

        this.router.refreshBaseUrl();
        this.router.refreshNavigation();

    }