Как сделать несколько шаблонов?

Question

[Pogran]

У меня сейчас в app.component.ts прописан шаблон app.component.html (это главный шаблон со своей структурой) . На странице авторизации я хочу чтобы отображался другой шаблон, как мне это сделать? нужно как-то сделать чтобы не app.component.html погрузился а login.component.html

Comments

[Pogran]

Решил вопрос вот такой структурой prntscr.com/d7ygtx , оказывается в роутинге можно задавать children :)

Answer 1

[Дмитрий Клусевич]

Создай отдельный компонент и грузи с помощью роутинга. app.component.ts это база, и не более. У меня он выглядит так, как правило

/**
 * Основной компонент приложения
 * @description Входная точка для основного маршрутизатора
 * */
import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'app',
    template: '<router-outlet></router-outlet>'
})

export class AppComponent implements OnInit {
    constructor(){}
    ngOnInit() {};
}

Все остальное разбито на отдельные компонеты

Comments

[Pogran]

Смотрите про что я. У меня есть шаблон main. В него я подключаю какие-то компоненты, а дальше вместо , должен подставляться компонент который указан в роутинге. Т.е если я укажу в роутинге компонент лейаута, то это не правильно будет, т.к в самом компоненте лейаута вместо у меня ничего не загрузится.

Например. сейчас входной app выглядит так template: '' , и есть routing path: '', component: MainLayoutComponent, и получается что у меня сейчас лейаут загрузится который имеет такое содержимое prntscr.com/d7wpks

И мне надо чтобы вместо - подгрузился HomeComponent, но я не могу его задать, т.к у меня в роутере указан MainLayoutComponent

[Дмитрий Клусевич]

Используйте вложенный роутинг.

[Pogran]

Дмитрий Клусевич: да спасибо, так уже и сделал, просто не знал что можно