Zastosowanie RouterLink z zagnieżdżonego komponentu

Question

Korzystanie kątowa 2 beta.0

Mam struktury komponentów Podobnie jak

App (Has RouteConfig) 
-> List 
| -> ListItem (Want to use RouterLink from here) 

To powoduje błąd: Component "List" has no route config.

Więc stawiam na RouteConfig komponent List jak ...

@RouteConfig([ 
    {path: '/:id', name: 'Details', component: Detail} 
]) 

Ale ja dostaję błąd w kątowym jak Error: Child routes are not allowed for "/list". Use "..." on the parent's route path.

Próbowałem już dodając te 3 kropki przed i po ścieżce/list w tej konfiguracji trasy ... bez powodzenia.

Dokumentacja na routerze jest bardzo lekki i choć wiem, że to ma być oparta off UI-router, nie widzę równolegle dodać zagnieżdżone trasy

Answer 1

można go używać tak, w składnik nadrzędny:

@RouteConfig([ 
    {path: '/', component: HomeComponent, as: 'Home'}, 
    {path: '/list/...', component: ListComponent, as: 'List'} 
]) 

a potem w swojej ListComponent, określić swoje trasy dziecko:

@RouteConfig([ 
    { path: '/:id', component: ListItem, as: 'ListItem' } 
]) 

Upewnij się, że ma 01 jak dobrze ..

Answer 2

Jeśli próbujesz zrobić, to użyć routerLink z jednego komponentu dziecko faktycznie pójść do jednego z rodziców skonfigurowanych tras, wtedy nie trzeba wkładać żadnego RouterConfig w przypadku dziecka wystarczy upewnić się, że trasa jest poprawnie skonfigurowana w rodzica, a następnie dodać stałą w dyrektywie dziecka w dekoratorze dziecka.

To będzie coś takiego:

nadrzędny:

import { ROUTER_PROVIDERS, RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router'; 
     : 
    (some more imports) 
     : 
@Component({ 
     : 
    directives: [ROUTER_DIRECTIVES], 
    providers: [ROUTER_PROVIDERS], 
     : 
}) 

@RouteConfig([ 
    {path: '/:id', name: 'Details', component: Detail} 
]) 

dziecka:

import { ROUTER_DIRECTIVES } from 'angular2/router'; 
    : 
    : 
@Component({ 
    : 
    directives: [ROUTER_DIRECTIVES], 
    : 
}) 

Nie należy również zapominać, aby skonfigurować poprawnie routerLink podając trasę, którą chcesz wysłać e użytkownikowi jako pierwszy parametr tablicy, a następnie dodać parametry, które chcesz wysłać do trasy docelowej przy użyciu tej samej nazwy daliście je w RouteConfig, tak:

<a [routerLink]="['Details', { id: product.productId }]"> Details link </a>