Маршрутизатор Angular 2 - не удается получить статические данные маршрута от службы
Используя angular/router 3.0.0-rc-2, мне не удалось получить данные, определенные на маршруте, из службы, которую я создал.
Однако я могу получить данные из компонента, определенного для этого маршрута, введя ActivatedRoute.
Вот мой маршрут:
export const CommonRoutes:RouterConfig = <Route[]>[
{
path: '',
component: Home,
data: {
someKey: true
}
}
];
Вот реализация, которая работает, но я не хочу делать это, так как мне нужен сервис, чтобы иметь возможность обрабатывать эту логику:
import {ActivatedRoute} from '@angular/router';
@Component({
//component config...
});
export class Home {
constructor(private _route: ActivatedRoute ) {
this._route.data.subscribe(data => {
console.log(data);
})
}
}
Как и следовало ожидать, компонент Home при загрузке выплевывает:
{
someKey: true
}
Однако при перемещении этой логики в службу, внедренную в основной компонент приложения, она регистрирует пустой объект.
Я также попытался подписаться на события навигации маршрутизатора, что приводит к той же разнице.
Мне интересно, если это больше проблема парадигмы. Описание компонента документации ActivatedRoute гласит: Contains the information about a component loaded in an outlet. The information is provided through the params, urlSegments, and data observables.
- Это заставляет меня думать, что это сделает информацию о маршруте доступной только для компонентов, связанных с маршрутом.
Итак, я попробовал другой подход - пройти через маршрутизатор напрямую и использовать Router.routerState. Ниже приведен код класса обслуживания (именно здесь мне нужна эта логика):
//...truncate imports/injectable decorator....
constructor(private _router:Router) {
this._router.events
.filter(evt => evt instanceof NavigationEnd)
.subscribe(data => {
console.log(_router.routerState.snapshot.root.data);
});
}
Это регистрирует, казалось бы, неожиданно, и пустой объект для консоли.
Есть ли у меня какое-то фундаментальное недопонимание того, как маршрутизатор работает / должен использоваться? Я чувствую, что запросить у маршрутизатора статически определенные данные на текущем маршруте - это то, что должны делать компоненты. Но, возможно, я чокнутый. Тем не менее, для глобальной логики, которая зависит от переменной конфигурации, которая может присутствовать или не присутствовать в каждом отдельном компоненте, гарантирует выполнение этого в службе.
Часть меня чувствует, что такого рода чрезмерно ограничительный дизайн был недостатком в Angular 1, где они прописали, что было "лучше для вас", не принимая во внимание тот факт, что ситуации реального мира не всегда диктуют одну и ту же архитектуру...
Не уверен, что это актуально, но я запускаю этот проект через веб-пакет.
Любая помощь приветствуется.
1 ответ
Я считаю, что этот парень дал рабочий пример ответа.
Статические данные кажутся скрытыми и скрытыми, но они присутствуют. В вашем случае это будет (обратите внимание на атрибут firstChild):
constructor(private _router:Router) {
this._router.events
.filter(evt => evt instanceof NavigationEnd)
.subscribe(data => {
console.log(_router.routerState.root.firstChild.snapshot.data);
});
}
Пробовал локально и у меня сработало.