Внедрить компоненты в Angular masterpage, когда используется роутер-розетка - PullRequest
0 голосов
/ 07 марта 2019

Как реализовать хорошую концепцию главной страницы с внедрением контента при использовании угловой маршрутизации?

MasterPageComponent:

<header>
   <ng-container *ngTemplateOutlet="menuContent"></ng-container>
</header>
<main>
  <router-outlet></router-outlet>
</main>
<footer>
INJECT CONTENT HERE
</footer>

Маршрутизация:

 {
    path: '',
    component:MasterPageComponent,
    children: [
      { path: 'single', component:ChildComponent },
    ]
  }

ChildComponent:

<ng-template #header> INJECT HEADER! </ng-template>

<p>
  Page content
</p>
  1. Итак, я попробовал ng-template и ng-container , и они не работают, когда шаблон находится внутри маршрутизатора и не может быть разрешен.
  2. Мне не нравится концепция ng-content , тогда как вам нужно добавить MasterPageComponent на все страницы вместо одного места в маршрутизации! Это выглядит как плохой дизайн.
  3. Если я буду использовать другую розетку маршрутизатора, как связать данные нижнего колонтитула с основным контентом?

Может быть, у вас есть предложение, как реализовать правильные мастер-страницы с внедрением контента и оставить текущую структуру маршрутизации. Заранее спасибо.

...