Google Maps 和 Angular js:TypeError:无法读取 undefined 的属性“触发器”

我正在尝试让Angular与谷歌地图一起工作。似乎无法让它工作！我得到的只是灰屏。

我获取每个经销商的所有 LatLng 并从模板传递给控制器。当用户单击相关链接时，它应该在地图上显示经销商。

我正在使用谷歌扩展，但我收到类型错误：无法读取未定义的属性"触发器"。

.HTML：

<p><a data-location="{dLat:{{dealer.lat}}, dLng:{{dealer.lng}}, dCode:{{dealer.dealerCode}}}" ng-click="dealerMapInfo(dealer.lat, dealer.lng, dealer.dealerCode, $event)" href="#">Details</a></p>

地图服务：

(function(){
'use strict';
angular
    .module('osbApp.core')
    .factory('mapService', MapService);

function MapService() {
    var api = {};
    var config = {
            language : "en-GB", 
            countryCode : "GB", 
            imagePath : "http://www.test.co.uk/dl/mapmarkers/", 
            countryBounds : [{lng : 2.69, lat : 60.85}, {lng : -9.23, lat : 60.85},{lng : -9.23, lat : 49.84},{lng : 2.69, lat : 49.84}] 
    };
    var mapAPI = new googleMapsApi(config),
        map = new mapAPI.map(document.getElementById('myMap'), {
        center : {
            lat : 54.501911,
            lng : -4.100353
        },
        zoom : 5
    });

    api.map = map;
    return api;
}

}）（）;

控制器（点击）：

$scope.dealerMapInfo = function(latitude, longitude, dealerCode, $event) {
        if ($event) {
            $event.preventDefault();
        }
        var dealerLatLng = {
            lat: latitude,
            lng: longitude
        };
        $scope.test = dealerLatLng;

        $scope.$watch('test', function () {
            $timeout(function(){
                console.log(dealerLatLng);
                mapService.map.event.trigger(mapService.map, 'resize');
                mapService.map.setCenter(dealerLatLng);
                mapService.map.setZoom(15);
                mapService.map.addMarker(dealerLatLng);

            },100);
        });

    };