对子路由器使用route-href

Question

我正在尝试route-href在子路由器中的视图中使用该属性.我的父路由器看起来像这样:

configureRouter(config, router){
    config.title = 'Kali';
    config.map([
        // { route: '', moduleId: 'no-selection', title: 'Select'},
        { route: ['', 'courses'],  moduleId: 'courses' }
    ]);

    this.router = router;
}

我的孩子路由器看起来像这样:

configureRouter(config, router){
    config.map([
        { route: ['', '/'], moduleId: 'no-selection', title: 'Select'},
        { route: '/:id',  moduleId: 'courses/course-detail' }
    ]);

    this.router = router;
}

这是我的route-href属性......

<a route-href="route: '', params: { id: course.id }" click.delegate="$parent.select(course.id)">

当我使用它时,我希望route-href使用来自子路由器的路由.相反,我得到了这个堆栈跟踪.查看代码,我看到RouteHref调用router.generate创建路由.router.generate应该递归地走上路由器heirarchy,这应该不是问题.但是,我不确定将哪个路由器传递给route-href构造函数.我认为这里有两个问题 - 首先,我不确定是否route-href正在接收正确的路由器,其次,我不确定是否或如何route-href使用空路由处理表达式.

堆栈跟踪:

message: "There is no route named '', params: { id: course.id }"
stack: "Error: There is no route named '', params: { id: course.id }?    at RouteRecognizer.generate (http://localhost:9000/jspm_packages/github/aurelia/route-recognizer@0.4.0/index.js:244:19)?    at AppRouter.generate (http://localhost:9000/jspm_packages/github/aurelia/router@0.8.0/router.js:210:38)?    at Router.generate (http://localhost:9000/jspm_packages/github/aurelia/router@0.8.0/router.js:207:32)?    at RouteHref.processChange (http://localhost:9000/jspm_packages/github/aurelia/templating-router@0.12.0/route-href.js:42:34)?    at RouteHref.bind (http://localhost:9000/jspm_packages/github/aurelia/templating-router@0.12.0/route-href.js:30:16)?    at BehaviorInstance.bind (http://localhost:9000/jspm_packages/github/aurelia/templating@0.11.0/behavior-instance.js:68:35)?    at View.bind (http://localhost:9000/jspm_packages/github/aurelia/templating@0.11.0/view.js:68:26)?    at ViewFactory.create (http://localhost:9000/jspm_packages/github/aurelia/templating@0.11.0/view-factory.js:173:18)?    at BoundViewFactory.create (http://localhost:9000/jspm_packages/github/aurelia/templating@0.11.0/view-factory.js:127:35)?    at Repeat.processArrayItems (http://localhost:9000/jspm_packages/github/aurelia/templating-resources@0.11.0/repeat.js:132:32)"

有任何想法吗？谢谢.

Answer 1

它看起来像route-href使用name路线的属性.

也许您的子路由器应该如下所示:

configureRouter(config, router){
    config.map([
        { route: ['', '/'], moduleId: 'no-selection', title: 'Select'},
        { route: '/:id',  moduleId: 'courses/course-detail', name: 'course-detail' }
    ]);

    this.router = router;
}

在你看来:

<a route-href="route: course-detail; params.bind: { id: course.id }" ...