Utilizzo di route-href con router figlio

Question

Sto tentando di utilizzare l'attributo route-href all'interno di una vista in un router figlio. Il mio router genitore si presenta in questo modo:

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

    this.router = router; 
} 

mio router bambino sembra in questo modo:

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

    this.router = router; 
} 

Ed ecco la mia attributo route-href ...

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

Quando uso questo, Mi aspetto che route-href utilizzi i percorsi dal router figlio. Invece, ottengo questo stacktrace. Guardando attraverso il codice, vedo che RouteHref chiama router.generate per creare il percorso. router.generate dovrebbe risalire la gerarchia del router in modo ricorsivo, quindi non dovrebbe essere un problema. Non sono sicuro, tuttavia, quale router viene passato al costruttore route-href. Penso che ci siano due problemi qui - in primo luogo, non sono sicuro se route-href stia ricevendo il router corretto, e in secondo luogo, non sono sicuro se o come route-href gestisca un'espressione con una rotta vuota.

traccia stack:

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)" 

Tutte le idee? Grazie.

Answer 1

Sembra che route-href utilizzi la proprietà name del percorso.

Forse il vostro router bambino dovrebbe assomigliare a questo:

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

    this.router = router; 
} 

e nella vista:

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