ng-map点击无法在移动设备上工作

问题描述:

我正在构建一个需要谷歌地图的混合应用程序,并且由于我正在使用角度,所以我使用ng-map更容易。ng-map点击无法在移动设备上工作

我有一些问题标记

<marker position="{{m.center}}" ng-repeat="m in markers" on-click="selectRequest(m)" icon="images/marker-{{m.status}}.png"></marker> 

它的工作原理与鼠标的桌面罚款上单击事件,但没有对手机触摸事件。

为什么?

+1

使用on-mousedown而不参见http://*.com/a/13735547/364113 – SSH

由于SSH上述评论我做到了这一点:

$scope.requests.forEach(function(elem) { 
       var marker = new google.maps.Marker({ 
        map: map, 
        position: new google.maps.LatLng(elem.latitude, elem.longitude), 
        icon: "images/marker-"+elem.status+".png", 
       }); 

       google.maps.event.addListener(marker, "mousedown", function() { 
        $scope.selectedRequest = elem; 
        $scope.$apply(); 
       }); 
      }); 

您可以用鼠标点下发现一个问题,因为它会火上,你不希望其他行动。 你可以这样做:(需要您的控制器上注入$间隔)

var ctrl = this; 

var count = 1; 

var clock; 

ctrl.map; 

var lat = -23.56; 

var long = -46.65; 

// Start Hold To Mark Controller 
var startCount = function(event){ 
    count = 1; 
    if (angular.isDefined(clock)) return; 
    clock = $interval(function() { 
    if(count > 0){ 
     count = count - 1; 
    } else{ 
     addMarker(event.latLng); 
     stopCount(); 
    } 
    }, 500); 
}; 

var stopCount = function(){ 
    if (angular.isDefined(clock)) { 
    $interval.cancel(clock); 
    clock = undefined; 
    } 
}; 

$scope.$on('$destroy', function() { 
    stopCount(); 
}); 
// End Hold To Mark Controller 

// Start GoogleMaps Map Controller 
function initMap() { 
    if(lat == null || long == null){ 
    var center = { lat: -23.56, lng: -46.65 }; 
    } else{ 
    var center = { lat: lat, lng: long }; 
    } 

    ctrl.map = new google.maps.Map(document.getElementById('map'), { 
    disableDefaultUI: true, 
    zoom: 12, 
    center: center 
    }); 

    google.maps.event.addListener(ctrl.map, 'mousedown', function(event) { 
    startCount(event); 
    }); 

    google.maps.event.addListener(ctrl.map, 'mouseup', function(event) { 
    stopCount(); 
    }); 

    google.maps.event.addListener(ctrl.map, 'dragstart', function(event) { 
    stopCount(); 
    }); 
}; 

function addMarker(location) { 
    var marker = new google.maps.Marker({ 
    animation: google.maps.Animation.DROP, 
    draggable: true, 
    position: location, 
    map: ctrl.map 
    }); 
    markers.push(marker); 
}; 

initMap(); 
// End GoogleMaps Map Controller 

这样你就会把一个记号的地方在1秒内,如果你删除你的手指或移动它,标记将不会被创建。