2016-07-25 2 views
2

Я использую новый route3 и хотел бы знать, что такое синтаксис URL, чтобы указать вспомогательный компонент для дочернего маршрута.Как указать вспомогательный компонент для дочернего маршрута в angular2 router3

Я следующее определение ребенка по маршруту:

const router: RouterConfig = [ 
    { 
    path: 'component-c', component: ComponentC, children: [ 
     { path: 'auxPath', component: ComponentAux, outlet: 'aux'}, 
     { path: 'c1', component: ComponentC1 } 
    ] 
    } 
]; 

И шаблон для ComponentC это как

@Component({ 
    selector: 'component-c', 
    template: ` 
    <div>Child Route Component</div> 
    <router-outlet></router-outlet> 
    <router-outlet name="aux"></router-outlet> 
    `, 
    directives: [ROUTER_DIRECTIVES] 
}) 

URL /компонент-с/с1 отображает ComponentC1; Однако, я пробовал много комбинаций, как /компонент-с (посыл: auxPath)/c1, /компонент-с/с1 (посыл: auxPath), и т.д., и до сих пор не может понять как получить ComponentAux для отображения ...

ответ

3

Вы должны попробовать создать свой URL, как показано ниже.

this.router.navigateByUrl('/component-c/(c1//aux:auxPath) 

По моей последним расследованию текущего маршрутизатора версии есть некоторые проблемы в навигации к AUX выхода, используя routerLink и navigate метода. Вы должны создать полный URL-адрес и использовать navigateByUrl.

Plunker с example. Нажмите кнопку «Подробно», а затем «Администратор». Администратор маршрутизируется в магазине администратора. Откройте в полноэкранном режиме, чтобы увидеть формирование URL.

URL-адрес имеет следующий семантике путь

  1. Ребенок отделенных/
  2. Если путь имеет братьев и сестер, то он должен быть окружен с скобкой()
  3. Sibling разделены //
  4. Выход и путь разделены следующим образом:

    Parent/child/(gchild1//outletname:gchild2)

Другой так question

+0

Это работает! а также спасибо за подсказку, я сталкиваюсь с той же проблемой с routerLink и методом навигации. –

+0

@Arpit, вы могли бы отметить этот вопрос как дублированный ответ, я вижу, что связанный ответ почти такой же :) –

+0

Действительно, как и мои ответы подчёркиваются требованием айеров. Я мог бы увидеть в следующий раз. –

Смежные вопросы