Aurelia: Навигация по дочернему маршрутизатору: маршрут не найден

Ниже приведены мои представления: 1. app - стандартное 2. home - имеет список элементов слева, при выборе любого из них будет отображаться некоторый контент справа в представлении маршрутизатора (представление контракта для загрузки). 3. contract-view

app.ts: конфигурация маршрута:

configureRouter(config: RouterConfiguration, router: Router) {
        config.title = 'Contracts Portal';
        config.map([
            { route: ['', 'home'], name: 'home', moduleId: 'home', nav: true, title: 'Home' },
            { route: 'resources', name: 'resources', moduleId: 'resources', nav: true, title: 'Resources' },
            { route: 'tools', name: 'tools', moduleId: 'tools', nav: true, title: 'Tools' }
        ]);
        this.router = router;
    }

Конфигурация маршрутизатора Home.ts:

configureRouter(config: RouterConfiguration, router: Router) {
        config.title = "test";
        config.map([
            { route: ['', 'contract-view/:id'], name: 'contract-view', moduleId: 'contract-view', nav: true, title: 'Test' } 
        ]);
        this.router = router;
    }

при выборе элемента в списке домашней страницы я пытаюсь выполнить навигацию, как показано ниже, для загрузки содержимого в представлении маршрутизатора правой панели в home.ts:

this.router.navigateToRoute("contract-view", { id: 4090 });

Однако выдает ошибку: Маршрут не найден: /contract-view/4090

На данный момент это все еще домашняя страница и маршрут по умолчанию, поэтому URL-адрес выглядит так: http://localhost:9000/#/, и поэтому он не работает. Но если я вручную изменю URL-адрес на http://localhost:9000/#/home, а затем выберу элемент списка, переход к просмотру контракта будет работать. Что мне здесь не хватает?

Я ищу абсолютную навигацию по пути. Попытка перехода к home/contract-view завершается с ошибкой: не удалось найти маршрут с именем «home/contract-view». Проверьте это имя: home/contract-view было указано в конфигурации маршрута.


person TSR    schedule 17.12.2015    source источник


Ответы (2)


Маршрут по умолчанию Home.ts имеет параметр:

config.map([
     { route: ['', 'contract-view/:id'], name: 'contract-view', moduleId: 'contract-view', nav: true, title: 'Test' } 
]);

Это может быть проблемой, поскольку параметр :id не упоминается в имени. Итак, я предлагаю вам изменить маршрут следующим образом:

config.map([
     //create another route with no parameters,
     //this route will represent an empty selection of contract
     { route: [ '', 'contract-view' ], name: 'contract-view-empty', moduleId: 'contract-view-empty', Title: 'Select a Contract' } 
     { route: 'contract-view/:id', name: 'contract-view', moduleId: 'contract-view', nav: true, title: 'Test' } 
]);

Затем для создания навигационной ссылки вы можете использовать атрибут route-href. Как это:

<a route-href="route: contract-view; params.bind: { id: 4090 }">Navigate</a>

Надеюсь, поможет!

person Fabio Luz    schedule 17.12.2015
comment
Навигация по умолчанию в порядке. Проблема возникает только тогда, когда я перемещаюсь из модели представления, используя это: this.router.navigateToRoute("contract-view", { id: 4090 }); Он пытается выполнить относительную навигацию, в то время как URL-адрес все еще читается /#/. - person TSR; 18.12.2015
comment
Кроме того, у меня нет тега a, но есть div, который не отвечает на route-href. Итак, я использую click.delegate=$parent.select(contract) и в функции выбора я перемещаюсь. - person TSR; 18.12.2015
comment
пожалуйста, предоставьте html, содержащий функцию div и select. - person Fabio Luz; 18.12.2015
comment
` ‹ul› ‹li repeat.for=contract of Contracts click.delegate=$parent.select(contract)› ... ‹/li› ‹/ul› ` - person TSR; 21.12.2015
comment
Вы можете использовать a? <ul> <li repeat.for="contract of contracts" > <a click.delegate="$parent.select(contract)"></a> </li> </ul> - person Fabio Luz; 21.12.2015

Это проблема с фреймворком Aurelia Router. Обсуждение и обходной путь здесь: https://github.com/aurelia/skeleton-navigation/issues/ 230

person TSR    schedule 22.12.2015