Маршрутизатор Angular2: не удается найти основной выход для загрузки HomeComponent

пытался переключиться на новый маршрутизатор, как в версии «@ angular / router»: «3.0.0-beta.2» в сочетании с «@ angular / *»: «2.0.0-rc.4», следуя официальной документации на ComponentRouter.

Однако я столкнулся с проблемой при попытке загрузить мое приложение с помощью HomeComponent по умолчанию:

Cannot find primary outlet to load 'HomeComponent'

Похоже, это связано с использованием templateUrl и внешнего html-файла вместо использования встроенного стиля шаблона.

Компонент HomeComponent изначально не отображается в окне, а ошибка выводится на консоль. Однако, когда я использую ссылку на Home Component, она отображается из вторых рук.

Как только я перейду с

templateUrl: 'home.html'

to

template: '<router-outlet></router-outlet>'

ошибка исчезла, отображается HomeComponent и маршрутизация работает должным образом.

Это известная проблема? Это работает для кого-то, кто использует templateUrl? Есть ли что-то, что я должен уважать, чтобы заставить его работать?


angular angular2-router3 angular2-router
person Thorsten Viel    schedule 06.07.2016    source источник
comment
Можете ли вы показать метаданные компонента для домашнего компонента, похоже, вы указываете относительный URL-адрес, но не устанавливаете moduleid. moduleId: module.id. blog.oughttram.io/ угловой / 2016/06/08 /   -  person Arpit Agarwal    schedule 06.07.2016
comment
Конечно, я могу: @Component({ selector: 'app', directives: [ ROUTER_DIRECTIVES ], templateUrl: '/app/components/app/app.html' }) и @Component ({ selector: 'start.home', directives: [], templateUrl: '/app/components/start/page.home.html' }), так что это не должно быть проблемой   -  person Thorsten Viel    schedule 06.07.2016
comment
URL-адрес шаблона действительно работает. Это некоторая проблема с настройкой, если вы уверены, что добавили директиву маршрутизатора и выходы маршрутизатора в правильном месте. Обеспечьте плункер   -  person Arpit Agarwal    schedule 06.07.2016
comment
да. Работал в Plunkr.   -  person Thorsten Viel    schedule 06.07.2016
comment
ROUTER_DIRECTIVES в @Component({directives: [AnimatedImages, ROUTER_DIRECTIVES]}) вызывающе нужен, так как решает тег выхода   -  person Mahmoud Hboubati    schedule 06.08.2016
comment
@MahmoudHboubati ROUTER_DIRECTIVES устарел.   -  person Standaa - Remember Monica    schedule 29.10.2016

Ответы (1)


arrow_upward
28
arrow_downward

Проблема заключалась в том, что из-за экрана загрузки приложения <router-outlet></router-outlet> иногда еще не существовал из-за состояния гонки. Если вам нужно скрыть html-часть, содержащую выход, используйте [hidden] вместо *ngIf, чтобы гарантировать, что выход всегда находится в DOM и не удаляется условно.

person Thorsten Viel    schedule 06.07.2016