小编Jas*_*son的帖子

具体来说，如何在相应的信息窗口中显示与标记相关的信息？

通过遵循此处存储库上的示例，将为每个标记打开相同的信息。使用旧的角度谷歌地图，您可以轻松地将信息窗口插入标记内，并包含您想要的任何数据。

我看到了一些在模板中使用 {{ contentHere }} 设置内容的示例，但这只允许使用字符串。我需要像往常一样使用所有角度模板。

假设我们的模板类似于存储库示例：

<google-map height="400px"
        width="750px"
        [center]="center"
        [zoom]="zoom">
  <map-marker #marker
          *ngFor="let place of places"
          [position]="{ lat: place.latitude, lng: place.longitude }"
          [options]="markerOptions"
          (mapClick)="openInfoWindow(marker)">

      <map-info-window>
        <-- this is what i'm concerned with -->
        {{ place.description }}
      </map-info-window>
  </map-marker>
</google-map>

然后我们像 repo 示例一样添加 viewchild 并以相同的方式打开它：

@ViewChild(MapInfoWindow, {static: false}) infoWindow: MapInfoWindow;

openInfoWindow(marker: MapMarker) {
  this.infoWindow.open(marker);
}

虽然这确实打开了正确的标记，并且标记将反映动态信息，但这将为每个信息窗口显示相同的内容/地点.描述，这并不奇怪，因为正在使用单个 ViewChild。我想出了各种复杂的方法来做到这一点，并查看了源代码，但似乎没有一个明显的和/或内置的解决方案来在窗口中显示与内容相关的内容被标记者使用。没有将其作为基本示例似乎很奇怪。

你们中的任何人会如何去做这件事？

我试图在页面上添加到跨越的处理函数内调用另一个打字稿函数(任何类型).当我这样做时,处理函数工作正常,并将执行基本的事情,如设置变量,console.log等.但是,当试图调用任何类型的函数时,它将抛出一个错误'无法读取属性functionName of undefined ".例如,这里是有效的代码:

addListenter() {
if (!this.addListenerFired) {
  let iterateEl = this.el.nativeElement.querySelectorAll('span');
  for (let i = 0; i < iterateEl.length; i++) {
    iterateEl[i].addEventListener('click', this.showExcerptInfo);
  }
  this.addListenerFired = true;
}
showExcerptInfo (): void {
  this.selectedExcerptId = event.srcElement.id;
  console.log(this.selectedExcerptId);
}

但是,如果我更改处理程序函数以执行以下操作(或调用位于任何位置的任何函数,即使在同一组件中),它将无法工作并抛出错误:

showExcerptInfo () {
  let excerpt = this.excerptsService.getExcerpt(this.selectedExcerptId);
}

关于为什么会发生这种情况和/或如何解决这个问题的任何线索？