У меня есть суб-навигация на моей странице, которая отображает некоторые подзоны под общим основным видом. Я хотел бы передать объект в subviews через <router-outlet>
, чтобы я мог получить данные один раз в основном компоненте и просто поделиться им с моими дополнительными компонентами.
Примечание. Если я включаю директиву <one></one>
в main.html, она работает, но это не мое желаемое поведение.
Основной вид:
<h1>Details</h1>
<a [router-link]="['./sub1']">One</a> |
<a [router-link]="['./sub2']">Two</a> |
<a [router-link]="['./sub3']">Three</a>
<hr/>
<router-outlet [data]="maindata"></router-outlet>
Под просмотр 1:
<h2>{{ data.name }}</h2>
...
Основной вид:
@Component({
selector: 'main-detail',
directives: [ROUTER_DIRECTIVES],
templateUrl: './main.html'
})
@RouteConfig([
{ path: '/', redirectTo: '/one' },
{ path: '/one', as: 'One', component: OneComponent },
{ path: '/two', as: 'Two', component: TwoComponent },
{ path: '/three', as: 'Three', component: ThreeComponent }
])
export class MainComponent {
maindata: Object = {name:'jim'};
}
Под просмотр 1:
@Component({
selector: 'one',
directives: [CORE_DIRECTIVES],
inputs: ['data'],
templateUrl: './one.html'
})
export class OneComponent {
@Input() data;
}