AngularUI 地图绑定事件答案

【问题标题】：AngularUI map binding eventsAngularUI 地图绑定事件
【发布时间】：2013-09-12 16:07:15
【问题描述】：

我正在使用 angularJS 和 AngularJS UI 模块在我的应用程序上加载 gmap 并对其事件执行操作。问题是 ui-events 调用函数没有传递写入参数，实际上它没有向模块传递任何东西。

这是我的应用模块

angular.module('Maptesting', ['ui.map', 'ui.event'])
.controller('CtrlGMap', ['$scope', function($scope) {

    $scope.mapOptions = {
        center: new google.maps.LatLng(-54.798112, -68.303375),
        zoom: 11,
        mapTypeId: google.maps.MapTypeId.SATELLITE
    };

    $scope.myMarkers = [];


    $scope.addMarker = function ($event, $params) {
        $scope.myMarkers.push(new google.maps.Markers({
            map: $scope.myMap,
            position: $event.latLng
        }));
    };

    $scope.markerClicked = function(m) {
        window.alert("clicked");
    };
}]);

这是我使用 ui-events 进行调用的地图元素

<div ui-map="myMap"
  ui-options="mapOptions" 
  ui-event="{ 'map-click' : 'addMarker($event)'}"
  class="map-canvas">
</div>

每当我点击地图时，它都会在控制台上返回这个错误：

Uncaught TypeError: Cannot read property 'latLng' of null

我知道错误是因为 $event 为 null 但我不知道应该在哪里设置。

这是完整的项目：https://github.com/facuferrari/Climbing-App

【问题讨论】：

标签： javascript jquery angularjs angular-ui

【解决方案1】：

我有同样的问题。事实证明，如果您没有加载 JQuery，您将收到此错误。

【讨论】：

【解决方案2】：

我有同样的问题。加载 jQuery 是不够的。您必须在 Angular 之前加载 jQuery。这应该可以解决问题。

【讨论】：