angularjs google map markers+ ui-gmap-windows --->增加click 事件

jsp:

<div class="modal-body viewOnMap">
    <div class="cboxClose" ng-click="fn.close()">close</div>
    <div class="mgt-20">
        <ui-gmap-google-map center="map.center" zoom="map.zoom" draggable="true" options="options" bounds="map.bounds" >
            <ui-gmap-markers models="randomMarkers" coords="'self'" icon="'icon'" click="'onClicked'" >
                    <ui-gmap-windows show="showWindow">
                        <div ng-controller="infoWindowCtrl">
                            <a ng-click="showInfo()">Contact Info</a><hr class="mgt-5 mgb-5" ng-non-bindable/>
                            <a ng-click="showInfo()">Contact Address</a><hr class="mgt-0 mgb-5" ng-non-bindable/>
                            <a ng-click="showInfo()">Other</a>
                            <!--<span ng-click="showInfo()">Contact Info</span><hr class="mgt-0 mgb-0" ng-non-bindable/>
                            <span ng-click="showInfo()">Contact Address</span><hr class="mgt-0 mgb-0" ng-non-bindable/>
                            <span ng-click="showInfo()">Other</span>-->
                        </div>
                    </ui-gmap-windows>
            </ui-gmap-markers>
        </ui-gmap-google-map>
    </div>
</div>

js:

.controller('viewOnMapInfoCtrl',['$scope','$rootScope','NiHttp','NiDialog','$timeout','order','latlng','uiGmapIsReady',function($scope,$rootScope,NiHttp,NiDialog,$timeout,order,latlng,uiGmapIsReady){
    var vm = $scope.vm = {};
    var fn = $scope.fn = {};

    fn.close=function(){
        NiDialog.close();
    }
    if(order!=null && latlng==null){
        var srcOpt = {
            url: '/orderHistory/findLeadsByOrderCode',
            data: {orderCode:order.orderCode}
        };
        NiHttp.postForm(srcOpt)
            .success(function(data){
                console.log(_.uniq(_.pluck(data.result,'coordinate')));
                vm.coordinate=_.uniq(_.pluck(data.result,'coordinate'));
            })
    }
    if(order==null && latlng!=null){
        vm.coordinate=latlng;
    }
    $timeout(function () {
        $scope.map = {
         center: {
         latitude: latlng[0].split(',')[0],
         longitude: latlng[0].split(',')[1]
         },
         zoom: 13,
         bounds: {}
         };
         $scope.options = {
         scrollwheel: true
         };
         var createRandomMarker = function(i, bounds,latitude,longitude,idKey) {

         if (idKey == null) {
         idKey = "id";
         }

         var ret = {
         latitude: latitude,
         longitude: longitude,
         title: 'm' + i,
         showWindow: false,
         coords: {
             latitude: latitude,
             longitude: longitude
         },
         };
         ret[idKey] = i;
         return ret;
         };
         $scope.randomMarkers = [];
         // Get the bounds from the map once it's loaded
         $scope.$watch(function() {
         return $scope.map.bounds;
         }, function(nv, ov) {
         // Only need to regenerate once
         if (!ov.southwest && nv.southwest) {
         var markers = [];
         _.forEach(vm.coordinate,function(item,key){
         var latlng=item.split(',');
         console.log(latlng);
         markers.push(createRandomMarker(key, $scope.map.bounds,latlng[0],latlng[1]));
         })
         $scope.randomMarkers = markers;
         }
         }, true);
        _.each($scope.randomMarkers, function (marker) {
            marker.closeClick = function () {
                marker.showWindow = false;
                $scope.$apply();
            };
            marker.onClicked = function () {
                $scope.onMarkerClicked(marker);
            };
        });
    }, 0);

    var markerToClose = null;
    $scope.onMarkerClicked = function (marker) {
        markerToClose = marker; // for next go around
        marker.showWindow = true;
        $scope.$apply();
    };

}])

.controller('infoWindowCtrl', function($scope) {
    $scope.showInfo = function() {
        console.log('Button clicked!');
    }
})