Маршрутизатор 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);
        });
}

Пробовал локально и у меня сработало.

Другие вопросы по тегам