Ionic ngMap 信息窗口无法在设备上运行

Question

我一直在使用由 allenhwkim 创建的很棒的 ngMap 指令，但在设备上显示 info-windows 的标记时遇到问题。我尝试了不同的嵌套 "data-tap-disabled='true'" 和 "scroll='false'" 不同元素的方法，但没有成功。

我真的很喜欢他放在一起的 markercluster 模块，所以我一直在尝试依赖它，因为我们需要在大面积上绘制多个标记。回购协议中有一个很好的例子，使用自定义指令在全球范围内绘制商店，当缩放到足以看到单个标记时，信息-window 会在触发点击事件时出现一些数据。从 Chrome 测试时一切正常，但在 Android 设备和 iOs 模拟器上测试时，信息 -windows 不会出现。但是，似乎正在注册点击，因为设备上的 screen/map 偏移，就好像信息 -window 应该出现一样（比如从 Chrome 进行测试）。

myDirective.js

.directive('stuffInfo', function(SomeData) {

    var StuffInfo = function(s, e, a) {
        this.scope = s;
        this.element = e;
        this.attrs = a;
        this.show = function(stuffId) {
            this.element.css('display', 'block');
            var showStuff = SomeData.getDataStuff(stuffId);
            var someMoreStuff = showStuff.stuff_users;
            s.someMoreStuff = someMoreStuff;

            this.s.$apply();
        }
        this.hide = function() {
            this.element.css('display', 'none');
        }
    };
    return {
        templateUrl: '/templates/stuff-info.html',
        link: function(scope, e, a) {
            scope.gameInfo= new GameInfo(scope, e, a);
        }
    }
})

map.html

<div id="map-container">
    <map zoom="12" center="[34.784426, -92.333411]" disable-default-u-i="true">

    </map>

    <div add-stuff-info="" class="custom-control">Add Stuff</div>
</div>

控制器附加点击监听器

var marker = new google.maps.Marker(stuff);
google.maps.event.addListener(marker, 'click', function() {
    $scope.stuff = this;

    map.setCenter(this.getPosition());
    $scope.stuffInfo.show($scope.stuff._id);
});

style.css

div#map-container div[add-stuff-info] { 位置：绝对；显示：none；顶部：5px；右：5px；底部：5px；宽度：40% } div#map-container div[add-stuff-info] a.hide-link { float:right } div#map-container div[add-stuff-info] table { width: 100% } div#map-container div[add-stuff-info] table td { text-align: left;填充：5px；边框：1px 实心#ccc }

我似乎无法弄清楚这里的问题。我意识到的一件事是删除 this.element.css('display', 'block');从指令和 Chrome 的测试来看，浏览器似乎像设备一样运行 - 地图移动，因为它将显示信息 -window...

Answer 1

我遇到了完全相同的问题！包含标签 data-tap-disabled="true"

喜欢：

<ion-content data-tap-disabled="true" class="has-header padding">

希望对你有帮助!!

Ionic ngMap 信息窗口无法在设备上运行

Ionic ngMap infowindow not functioning on device

ionic

ng-map