Angular 2 - Используйте тот же самый резольвер для родительского и дочернего маршрутов

У меня есть приложение Angular 2.0 (стабильная версия), где один из объектов project. Для каждого из этих projects у меня есть данные, которые распространяются по разным разделам/маршрутам:

project/:id/overview
project/:id/documents
project/:id/logs
и т.д.

API для project возвращает большую часть данных в одном вызове, поэтому мне нужно вызвать его один раз и сделать его доступным для разных дочерних маршрутов.

Мои маршруты выглядят так:

export const routing: ModuleWithProviders = RouterModule.forChild([
    { path: 'projects',                   component: ProjectsComponent },
    { path: 'project/new',                component: NewProjectComponent },
    {
        path: 'project/:id',
        component: ProjectDetailComponent,
        resolve: {
            project: ProjectDetailResolve
        },
        children: [
            { path: '', redirectTo: 'overview', pathMatch: 'full' },
            { path: 'overview',           component: ProjectOverviewComponent },
            { path: 'documents',          component: DocumentsComponent },
            { path: 'logs',               component: LogsComponent },
        ]
    }
]);

ProjectDetailComponent в настоящее время успешно получает данные проекта с помощью Resolver (без проблем):

ngOnInit() {
    this.route.data.forEach((data: { project: any }) => {
        this.project = data.project;
    });
}

Но мне нужно передать этот же проект на дочерние маршруты, поскольку нет смысла запускать другой вызов API для каждого из этих маршрутов.

Я попытался использовать один и тот же код ngOnInit в дочерних компонентах, считая, что, возможно, маршрутизатор Angular также передаст данные маршрута, но не удастся.

Любые идеи, пожалуйста?

Спасибо

Ответ 1

Вы можете использовать свойство 'parent' 'route' для получения данных от родительских преобразователей.

ngOnInit() {
    this.route.parent.data.subscribe(data => {
        this.project = data.project;
    });
}

Ответ 2

В зависимости от того, насколько удален ваш объект разрешения по иерархии компонентов, вы можете достичь его с помощью свойства parent.

<сильные > Примеры:

ngOnInit() {
    this.route.parent.data.subscribe(data => this.project = data.project);
}

Или без подписки

ngOnInit() {
    this.project = this.route.snapshot.parent.data['project'];
}

P.S. Имейте в виду, что если ваш компонент глубже одного уровня, вы можете связать свойство parent неограниченное количество раз. Как this.route.snapshot.parent.parent.data['project']. Ура!