Question

我正在开发一款可在Android上运行的离子应用。在特定的屏幕上，我有一个谷歌地图和一个搜索框。我使用谷歌地图的手机间隙插件来获取原生地图，而不是使用谷歌地图Javascript API，因为它太慢了。

搜索框是自动填充的，可以使用以下代码从Google获取地点 -

input = document.getElementById 'search-input'
autocomplete = new google.maps.places.Autocomplete(input)

这会为谷歌的地方自动填充输入字段。问题是我无法从自动完成下拉列表中选择任何选项。

我的HTML代码 -

<ion-content scroll="false">

   <div id="searchBox">
     <input id="search-input">
   </div>
   <div id="map-canvas">

</ion-content>

map-canvas保存地图。我尝试添加ng-focus="disableTap()"来输入搜索输入。

disableTap = ->
   container = document.getElementsByClassName 'pac-container'
   angular.element(container).attr 'data-tap-disabled', 'true'
   angular.element(container).on 'click', ->
        document.getElementById('search-input').blur()

我在this link

找到了这个解决方案

但这不起作用。这里有什么输入？我在这里结束了我的智慧。

Answer 1

以下对我有用。来自用户@ TillaTheHun0：

.controller('MyCtrl', function($scope) {
  $scope.disableTap = function(){
    container = document.getElementsByClassName('pac-container');
    // disable ionic data tab
    angular.element(container).attr('data-tap-disabled', 'true');
    // leave input field if google-address-entry is selected
    angular.element(container).on("click", function(){
        document.getElementById('searchBar').blur();
    });
  };
})

Answer 2

好的，我找到了解决方案，这将使您能够在移动设备上进行选择在创建地图后添加此内容

10^5

如果您感到困惑，我还会发布我的完整代码：

    $$('body').on('touchstart','.pac-container', function(e){
        e.stopImmediatePropagation();
    })

无法从Google地方选择自动填充

2 个答案: