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 。我想禁用 grandparent.component.ts 中child.component.ts中的按钮。我该怎么做？

Answer 1

我会用服务做这件事。该服务将：

• 公开一个在禁用/启用控件时发出的observable
• 公开一个应该调用的函数来生成observable emit

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

• 孙子订阅了可观察的onInit
• 祖父母称呼该职能
• 函数导致observable发出
• 孙子接收发射，并禁用/启用其控制

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

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

2. 祖父母可以将值写入window对象，因为所有组件都可以看到它。例如：window.enableControls = false。子可以有setInterval或Observable.interval，每500毫秒读取一次该值并更新子控件。清除the child component is destroyed或您发生内存泄漏的时间间隔。

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