Роуты — по-русски пути — для вызова разных частей большого приложения = удобный, красивый и комфортный способ разделить приложение на отдельные модули. Например, для нашего тестового — мы отделим «страницы» от «товаров».
Внимание! Трудности и их преодоление («@angular/router»: «3.0.0-alpha.7»)
Замечательный сюрприз приготовило нам руководство по второму ангуляру — а именно невалидность собственно настройки роутов. Все таки новая версия еще не стабильна — и поэтому разработчики позволяют себе такие штуки.
src_front/ts/app.routes.ts(1,10): error TS2305: Module '"/node_modules/@angular/router/index"' has no exported member 'provideRouter'. src_front/ts/app.routes.ts(1,25): error TS2305: Module '"/node_modules/@angular/router/index"' has no exported member 'RouterConfig'.
Но мы же умненькие — и полезем смотреть что там у нас такое… А у нас — у нас старые модульки (тоже из туториала, чуть не обновили одно обновив второе).
Заменим на более новую версию
Получим еще одну маленькую ошибку
Cannot GET /node_modules/@angular/router/bundles/router.umd.js
В системной загрузке уберем модуль и руками его допишем (systemjs.config.js)
Точка входа
main.ts как и раньше наша точка входа, но теперь она грузит «верхний» компонент
app.routes.ts настройки путей
app.component.ts и мегаменюшка для приложения
Контроллеры собственно
store.component.ts из прошлого примера
page.component.ts произвольный «другой» компонент
Трудности и их преодоление часть вторая («@angular/router»: «3.0.0-beta.2»)
Стоило чуть поднять версию роутера — и все опять повалилось
EXCEPTION: Error: Uncaught (in promise): Can't resolve all parameters for RouterOutlet: (RouterOutletMap, ViewContainerRef, ?, name).
Если у Вас так и случилось тоже — то поднимаем и остальные компоненты, и все снова хорошо)