Aurelia：子路由器导航：找不到路由

Question

以下是我的观点：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 。

Answer 1

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 attr。 像这样：

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

希望能帮助到你！

Answer 2

这是Aurelia路由器框架的问题。 此处的讨论和解决方法： https : //github.com/aurelia/skeleton-navigation/issues/230