ng-map点击在移动设备上不起作用

Question

我正在构建一个需要谷歌地图的混合应用程序，因为我正在使用angular，所以使用ng-map对我来说更容易。

我对标记的on-click事件有一些问题

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

它可以很好地在桌面与鼠标，但不与触摸事件在手机上。

为什么?

Answer 1

感谢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();
                });
            });

Answer 2

使用mouse down可能会出现问题，因为它会触发您不想要的其他操作。你可以这样做:(需要在控制器上注入$interval)

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秒之前在这个地方做一个标记，如果你移开手指或者移动手指，这个标记就不会被创建。