如何等待角谷歌地图追加getGMap的控制对象 [英] How to wait for Angular Google Maps to append getGMap to the control object

查看:170
本文介绍了如何等待角谷歌地图追加getGMap的控制对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在试图建立click事件侦听器的由 UI-GMAP,谷歌创建的 google.maps.Map 对象 - 地图角谷歌地图图书馆。

I've been trying to set up click event listeners on the google.maps.Map object that's created by the ui-gmap-google-map directive from the Angular Google Maps library.

我需要动态地做到这一点,这样看来(我的简短测试至少),使用了事件 UI-GMAP参数 - 谷歌地图指令将无法正常工作(因为它似乎读的参数值只有一次,但也许我错了)。

I need to do this dynamically, so it seems (by my brief testing at least) that using the events parameter on the ui-gmap-google-map directive won't work (because it seems to "read" the parameter value only once, but maybe I'm wrong about that).

所以我决定使用控制参数,增强与方法的参数值命名的对象 getGMap 刷新。这里是我的指令用法如下:

So I decided to use the control parameter, which augments the object named by the parameter value with the methods getGMap and refresh. Here is what my directive usage looks like:

<ui-gmap-google-map center="appCtrl.mapSetup.center"
                    zoom="appCtrl.mapSetup.zoom"
                    control="appCtrl.mapSetup">
</ui-gmap-google-map>

最后,我加载了谷歌地图API异步,并依托 GoogleMapApi 服务/承诺(角谷歌地图的一部分)知道什么时候我可以放心地开始与 google.maps.Map 对象处理(例如添加事件监听器等)。这里是什么样子的一个小例子:

Finally, I'm loading the Google Maps API asynchronously, and relying on the GoogleMapApi service/promise (part of Angular Google Maps) to know when I can start safely dealing with the google.maps.Map object (e.g. adding event listeners etc.). Here is a small example of what that looks like:

// inside the AppController constructor, see the fiddle linked below
var mapSetup = this.mapSetup;
GoogleMapApi.then(function () {
    google.maps.event.addListener(mapSetup.getGMap(), 'click', function () {
        alert('hello');
    });

因此​​,当页面加载(这里的小提琴),我得到类型错误:未定义不是一个函数,因为在 mapSetup 对象尚未与增强 getGMap 刷新。现在看来似乎应该是,根据我的文档的理解。

So when the page is loaded (here's the fiddle), I get "TypeError: undefined is not a function" because the mapSetup object hasn't been augmented with getGMap or refresh. It seems like it should have been, based on my understanding of the documentation.

我包了的addListener 用几百毫秒的延迟 $超时(该角服务)打电话,那么它的工作,因为 mapSetup 对象届时已被增强与 getGMap

I wrapped the addListener call with $timeout (the Angular service) using a few hundred millisecond delay, and then it worked because the mapSetup object had by that time been augmented with getGMap.

有没有一种方法,以避免使用 $超时与任意延迟等到控制 - 指定的对象实际上是增加?

Is there a way to avoid having to use $timeout with an arbitrary delay to wait until the control-specified object is actually augmented?

推荐答案

根据我的测试,并通过我的文档和各种问题的意见读过,看来这(等待控制来得到增强对象)的事情,在角谷歌地图 uiGmapIsReady 服务被设计为一体。

By my testing and by what I've read in the docs and in various issue comments, it seems that this (waiting for the control object to get augmented) is one of the things that the uiGmapIsReady service in Angular Google Maps was designed for.

我目前的理解是, uiGmapGoogleMapApi 应该用来等待谷歌地图API的异步加载和 uiGmapIsReady 应该用于等待 uiGmap * 指令和所有他们意味着(包括控制对象扩充)来完成。命名说明了一切。

My current understanding is that uiGmapGoogleMapApi should be used to wait for async loading of the Google Maps API and uiGmapIsReady should be used to wait for uiGmap* directives and all they entail (including control object augmentation) to complete. The naming says it all.

下面的一个新的演示小提琴。这个演示的使用的isReady

Here's a new demo fiddle. This demo's usage of IsReady:

IsReady.promise().then(function (maps) {
    var map1 = $scope.control.getGMap();
    var map2 = maps[0].map;
    alert(map1 === map2); // true
});

IsReady.promise (<一个href=\"https://github.com/angular-ui/angular-google-maps/blob/develop/src/coffee/directives/api/utils/is-ready.coffee\">source)接受指示可选的整数参数(我pretty肯定) UI-GMAP,谷歌地图的数量指令您的网页使用,它默认为 1 。(如果你碰巧给它一个错误的号码,我相信有一个(远程?)可能返回的承诺永远不会解决。)

IsReady.promise (source) accepts an optional integer argument indicating (I'm pretty sure) the number of ui-gmap-google-map directives your page is using. It defaults to 1. (If you happen to give it a "wrong" number, I believe there's a (remote?) possibility that the returned promise will never resolve.)

这篇关于如何等待角谷歌地图追加getGMap的控制对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆