Angular 4 несколько розеток маршрутизатора

<div *ngIf="!loggedIn" class="login">
  <router-outlet></router-outlet>
</div>

<div *ngIf="loggedIn" class="main">
  <router-outlet></router-outlet>
</div>

У меня есть компонент входа в систему (живет в class="login") и компонент панели инструментов (живет в class="main"). У меня также есть компонент регистра, который находится в class="login" div. Теперь я знаю, что вы не должны использовать два <router-outlet> в одном шаблоне, но если они не отображаются одновременно, я не понимаю, в чем проблема. Я также пытался использовать метод [routersLink]="[{outlets}]", но он не смог заставить его работать. Может быть, потому что <router-outlet> не отображается из-за *ngIf.

Итак, проблема в том, что когда я перехожу из компонента панели инструментов, я вижу компонент входа в систему. Когда я перехожу от входа в систему к компоненту регистрации, маршрут обновляется, но компонент регистрации не срабатывает. Если я перейду прямо со страницы входа на страницу регистрации, он направит и запустит компонент регистрации.


person turd.ferguson    schedule 25.01.2018    source источник
comment
Вероятно, вы могли бы решить эту проблему, используя именованные розетки, проверьте этот пост   -  person Mathias W    schedule 26.01.2018
comment
Я на самом деле пробовал это и потратил 2 часа безрезультатно.   -  person turd.ferguson    schedule 26.01.2018
comment
Поместите div.login внутри шаблонов компонентов входа и регистрации. Поместите div.main внутри шаблона панели инструментов. И вот: одна розетка маршрутизатора.   -  person JB Nizet    schedule 26.01.2018


Ответы (1)


Я поднимаю похожий вопрос и нашел следующий ответ. Посмотрите, работает ли это для вас,

person Nate May    schedule 22.06.2018