当我们导航到路线并加载组件时,
- 我们可以在加载的子组件中传递用
@Input
装饰的变量吗?我们可以订阅用@Output
装饰的EventEmitter
吗? - 父级中是否有可用的
lifecycle Hook
,其中定义了Route,我们可以获得对已加载组件的引用,以便动态地将值\订阅函数传递给子组件?
父组件
@Component({
moduleId: module.id,
selector: "parent",
templateUrl: "<router-outlet></router-outlet>"
})
@Routes([
{ path: "/child-component1", component: Child1Component }
])
export class Parent {
// Can we pass var1 and subscribe close here of Child1Component when route is navigated dynamically based upon path?
// Is there any lifecycleHook available in parent where Route is defined?
}
子组件
@Component({
moduleId: module.id,
selector: "child-component1",
template: "<div>{{var1}}</div><button (click)='closeMenu()'>Close</button>"
})
export class Child1Component {
@Input() var1: string;
@Output() close: EventEmitter<any> = new EventEmitter<any>();
constructor() { }
closeMenu = (): void => {
this.close.emit("");
}
}
我正在使用Angular2 RC1
提前致谢!
最佳答案
只需使用共享服务进行组件之间的通信。另请参阅https://angular.io/docs/ts/latest/cookbook/component-communication.html#bidirectional-service
输入和输出不能用于路由组件,因为它们只能应用于同一模板文件中的子组件。
关于angularjs - 在 Angular 2 组件中导航到路由时传递 @Input 并订阅 @Output,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37558497/