Angular 2 - 孙子访问

Question

如何访问孙组件？例如，我有一个grandparent.component.ts，parent.component.ts和child.component.ts。该child.component.ts在其模板按钮列表。parent.component.ts包含child.component.ts。该grandparent.component.ts包含parent.component.ts。我想禁用在该child.component.ts按钮grandparent.component.ts。我该怎么做呢？

Answer 1

我会用服务来做到这一点。该服务将：

• 公开一个可在应禁用/启用控件时发出的 observable
• 公开一个应该被调用以使可观察对象发出的函数

祖父母禁用孙子控件的事件顺序是：

• 孙子订阅 observable onInit
• 祖父母调用函数
• 函数导致 observable 发出
• 孙子接收发射，并禁用/启用其控件

在回答您的评论时，这里有两种我不推荐的选择

1. 您可以@Input()在祖父模板中使用父组件和数据绑定将值从祖父传递给父，并使用相同的机制——@Input()在子模板中和父模板中的数据绑定——将父的数据绑定属性传递给子。

2. 祖父母可以向window对象写入值，因为所有组件都可以看到它。例如：window.enableControls = false。Child 可以有一个setIntervalor Observable.interval，它每 500 毫秒读取一次该值并更新子控件。清除子组件销毁的时间间隔，否则会出现内存泄漏。

同样，我不推荐任何一种选择，但它们会起作用。