兄弟组件之间的沟通

Question

我有以下结构：

<master>
  <frame></frame>
  <toolbox></toolbox>
</master>

• master - ＆gt;主要组件
• 框架 - ＆gt;框架组件（加载一个 IFRAME）
• 工具箱 - ＆gt;工具箱组件

我将工具箱中的项目添加到带有drang＆amp;的iframe drop和每个被删除的元素我通过JS addEventListener添加一个click事件。当我单击一个元素时，我想返回一些数据并将其抓取到我的工具箱组件中并显示单击的元素。

我尝试过使用EventEmitter的服务（我知道这是不好的做法），但即使在工具箱组件中收到数据，我也无法对组件变量进行任何更改。

默认情况下，propertiesPanel输入设置为“True”，因此隐藏了我的div。

<div class="selected-item" [class.is-hidden]="propertiesPanel"></div>

然后我有了组件：

@Input() propertiesPanel = true;

ngOnInit() {
    // _connector is the Service I'm using for communication
    this._connector.get().subscribe(
         (data) => {
              this.propertiesPanel = false; // it changes the value to false
              this.addElements(); // dummy function - will have to add properties to the panel depending on which element I click
         }
    );
}

所以，即使我将Input设置为false，实际DOM中也没有任何动作，我不知道为什么。 （is-hidden class it not removed）

有什么想法？ 感谢

解决方案

显然你需要在subscribe（）中使用NgZone才能重新渲染视图......等等。

this._ngZone.run(() => { 
    this.propertiesPanel = false; 
}