javascript - Agm 方向面板：在不同组件中显示面板

Question

我有两个组件显示在一个页面上（第一个是页面的 70%，另一个是 30%）。一个是地图，另一个是我要显示面板的位置（有关如何到达目的地的信息：左转，然后右转等）

我使用 agm-directions 来获取面板 - https://robby570.tw/Agm-Direction-Docs/source/featured/direction.html（查看使用新查询更新面板）。

我设法很好地创建了它，当您单击按钮时，面板将显示文本，但在地图组件上，在地图下方（见图 2）。这是因为我把<div #myPanel></div>地图下的第一个组件。

我想在第二个组件上获取该面板文本。[panel]="myPanel"根据上面的文档，我不知道该怎么做，因为我在地图组件中绑定了面板。

那么有没有办法可以在不同的组件中传输绑定的数据？

这是第一个组件 html：

<agm-map [zoom]="zoom" [latitude]="lat" [longitude]="lng">
    ...

    <agm-direction
      [origin]="origin" 
      [destination]="destination" 
      [travelMode]="transitOptions" 
      [visible]="show"
      [renderOptions]="renderOptions"
      [markerOptions]="markerOptions"
      [panel]="myPanel" <!-- THIS IS IMPORTANT FOR INFO -->
    >
    </agm-direction>

    ...    
</agm-map>

<div #myPanel></div>

第二个组件只是一些通用的 html。

TLDR：当我在 agm 方向上绑定时，如何才能<div #myPanel></div>在不同的组件中工作。[panel]="myPanel"

Answer 1

设法获得价值感谢

@ViewChild("myPanel", {static: false}) myPanel;

然后，在单击按钮时激活的函数中：

let _this = this;
setTimeout(function() {
  console.log(_this.myPanel);
  if(_this.myPanel != undefined){
    let ivan = _this.myPanel;
    console.log("test myPath", ivan);
    //console.log("Test", JSON.stringify(this.myPanel.nativeElement.innerHTML));
    console.log(_this.myPanel.nativeElement.innerHTML); //THIS IS THE ANSWER
  }
}, 500);