Angular 4 - Как использовать один и тот же компонент в качестве дочернего маршрутизатора двух разных родительских компонентов? - PullRequest
Новая
       5

Angular 4 - Как использовать один и тот же компонент в качестве дочернего маршрутизатора двух разных родительских компонентов?

0 голосов
/ 29 ноября 2018

Мой вопрос о маршрутизации в угловых.У меня есть компонент TelephonicConversationComponent, который является дочерним маршрутизатором SearchProfileComponent.Я хочу снова использовать компонент (TelephonicConversationComponent) в JdTextSearchComponent.

По сути, у меня есть две вкладки (search-profile и jd-search).Под вкладкой search-profile есть еще две вкладки (telephonic-conversation и schedule-meeting).Под jd-search у меня есть две вкладки, одна из которых - jd-text-search.Я хочу повторно использовать telephonic-conversation в jd-text-search.

Вот моя часть кода, 

`{path:"search-profile", component:SearchProfileComponent,children:[
   {path: '', redirectTo:'telephonic-conversation',pathMatch:'full'},
   {path:"telephonic-conversation", component:TelephonicConversationComponent},
    {path:'schedule-meeting',  component:ScheduleMeetingComponent},
 ]},
 {path:"jd-search", component:JdSearchComponent,children:[
   {path: '', redirectTo:'jd-file-search',pathMatch:'full'},
   {path:"jd-file-search", component:JdFileSearchComponent},
   {path:'jd-text-search',  component:JdTextSearchComponent},
 ]},`

Как я могу повторно использовать telephonic-conversation в jd-text-search

Ответы [ 2 ]

0 голосов
/ 30 ноября 2018

Просто чтобы убедиться, что мы находимся на одной странице с терминами ... Дочерний компонент - это вложенный компонент, который содержится в шаблоне родительского компонента.

Таким образом, чтобы отобразить дочерний компонент в родительском, в HTML-файле jd-text-search.component.html, вы просто использовали бы селектор из дочернего компонента: 

<telephonic-conversation></telephonic-conversation>

Это помещает компонент непосредственно в другого компонента.(Нет маршрутизации).

Это то, что вы спрашиваете?

0 голосов
/ 29 ноября 2018

Если вы попытаетесь использовать компонент, вы можете объявить селектор в аннотации @Component

в html компонента, который вы хотите внедрить в другой компонент, вы можете использовать ваш селектор

ПРИМЕР: 

  @Component({
  selector: 'child-component',
  templateUrl: './child-component.component.html',
  styleUrls: ['./child-component.component.scss']
  })

в ваш parent.component.html вы можете сделать это 

<child-component></child-component>
...