Search code examples
javascriptangularjsionic-frameworkleafletangular-leaflet-directive

angular leaflet directive custom popup click event not triggered on iOS devices


I am using angular leaflet directive and ionic to develop map on iOS devices, and I need the popup clickable, it works fine on web browsers, but not on iOS simulator.

var html11 =
            '<div style="width:660px;" ng-click="goToDetail(clickedMarkerInfo)">'
            + '<div class="tripguide-tootip-row-left" ng-click="goToDetail(clickedMarkerInfo)">'
            + '<div class="tripguide-tootip-image">'
            + '<img ng-src={{clickedMarkerInfo.picture}}>'
            + '</div>'
            + '<div class="tripguide-tootip-rating" ng-show="whetherToShow(clickedMarkerInfo.rating)">'
            + '<img ng-repeat="pic in clickedMarkerInfo.ratingPics track by $index"src="{{pic}}" />'
            + '</div>'
            + '</div>'
            + '<div class="tripguide-tootip-row-right" ng-click="goToDetail(clickedMarkerInfo)">'
            + '<div class="tripguide-tootip-legend">'
            + '<span>{{clickedMarkerInfo.name}}</span>'
            + '</div>'
            + '<div class="tripguide-tootip-address">'
            + '<span>{{clickedMarkerInfo.address}}</span>'
            + '</div>'
            + '</div>'
            + '<div class="tripguide-tooltip-arrow">'
            + '<img src="images/tripguide/tooltip-arrow.png">'
            + '</div>'
            + '</div>';
 var marker = {
                lat: myLatlng[0],
                lng: myLatlng[1],
                getMessageScope: function () {
                    return $scope;
                },
                message: html11,
                compileMessage: true
            };

 $scope.markersArray.push(marker);

iOS version is 9.3. Maybe that is an ionic and iOS issue?? Any advice is appreciated.


Solution

  • ionic.tap.isElementTapDisabled= function(ele) {
                    if (ele && ele.nodeType === 1) {
                      var element = ele;
                      while (element) {
                      // if ((element.dataset ? element.dataset.tapDisabled : element.getAttribute && element.getAttribute('data-tap-disabled')) == 'true') {
                          if (element.getAttribute && element.getAttribute('data-tap-disabled') == 'true') {
                          return true;
                        }
                        element = element.parentElement;
                      }
                    }
                    return false;
                  };