angular-google-maps - 听取infowindow准备好的事件 [英] angular-google-maps - listen for infowindow domready event

问题描述

在普通js中收听domready事件谷歌地图相对容易
，如这里所述：

  infoWindow = new google.maps.InfoWindow（）; 
 google.maps.event.addListener（infoWindow，'domready'，function（）{
 //一旦DOM准备好就可以做什么
}）; 
  

然而，如何在 angular-google-maps 。

有没有解决方案？

解决方案

使用 Angular Google Maps 涉及使用infowindow控件对象 - 阅读文档。

正如这个问题 - 我第一次发布这个解决方案 - 你可以在主控制器中创建一个空的infowindow控制对象：

  $ scope.infowindowControl = {}; 
  

然后你将你的新对象绑定到 ui-gmap-window 指令定义如下：

pre $ < ui-gmap-window
选项=windowOptions
closeClick =closeClick（）
control =infowindowControl
>


在infowindow打开（实际上不确定哪一点） - 它会将五个函数传递给空对象在$ scope内创建。其中一些功能在文档中记录但是以一种相当随意且不确定的方式：

• getChildWindows（）


• getGWindows（）


• getPlurals（）


• hideWindow（）


• showWindow（）

您需要的是 getGWindows（） - 您将其放入标记点击事件。

这会为您打开一个数组的开放式infowindows，您现在可以在标准Google地图时尚中附加一个事件侦听器，如：

  var windows = $ scope.infowindowControl.getGWindows（）; 
 console.log（'在getGWindows'之后点击'，windows'）; 
 google.maps.event.addListener（windows [0]，'domready'，function（）{
 console.log（'infowindow domready just fired !!'）; 
}）; 
  

虽然这不是一个理想的，有据可查的或简单的解决方案（并花了我几个小时） - 并将函数传递给空对象坦率地违反直觉 - 它似乎工作。

Plunker here 。

Listening for the domready event in normal js Google maps is relatively easy as outlined here :

infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(infoWindow, 'domready', function() {
      // whatever you want to do once the DOM is ready
});

However it doesn't seem obvious how to do it in angular-google-maps.

Is there a solution ?

解决方案

The solution when using Angular Google Maps involves using the infowindow control object - see docs.

As noted in this issue - where I first posted this solution - you can create an empty infowindow control object within the main controller :

$scope.infowindowControl = {};

Then you scope bind your new object in the ui-gmap-window directive definition like :

<ui-gmap-window
    options="windowOptions"
    closeClick="closeClick()"
    control="infowindowControl"
>

On infowindow open (actually unsure at what point) - it will pass five functions to the empty object you created within $scope. Some of these functions are noted in the documentation but in a rather haphazard and non-defined way :

• getChildWindows()
• getGWindows()
• getPlurals()
• hideWindow()
• showWindow()

The one that you need is getGWindows() - which you put inside your marker click event.
This will get you an array of the open infowindows and you can now attach an event listener in the standard google maps fashion, like :

var windows = $scope.infowindowControl.getGWindows();
    console.log('inside click after getGWindows ', windows);
google.maps.event.addListener(windows[0], 'domready', function() {
    console.log('infowindow domready just fired !!');
});

While it's not an ideal, well documented or easy solution (and took me a number of hours to figure out) - and passing functions to an empty object is frankly counter-intuitive - it does seem to work.

Plunker here.

这篇关于angular-google-maps - 听取infowindow准备好的事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！