google Places自动完成下拉菜单未使用ionic3在iOS9中触发“ place_changed”事件

时间:2018-11-18 16:59:43

标签: javascript google-maps ionic-framework google-places-api

这是示例代码,非常基本,但是'place_changed'并未在iOS中触发

var input = document.getElementById('autocomplete');
        var autocomplete = new google.maps.places.Autocomplete(input);

        google.maps.event.addListener(autocomplete, 'place_changed', function(){
            mylocation = autocomplete.getPlace();
            alert(mylocation);
        })

尝试了以下解决方案:

1:从侦听器中删除了自动完成

google.maps.event.addListener('place_changed', function()

2:添加了 tappable ,因为pac-item不是按钮,链接。

let list1 = document.querySelectorAll(".pac-item,.pac-container");

     console.log('pacIt', list1);

     for (let i = 0; i < list1.length; ++i) {
         list1[i].setAttribute('tappable', 'true');
     }

3:添加了需要点击

 let list2 = document.querySelectorAll(".pac-item, .pac-item span");

     console.log('pacIt', list2);

     for (let i = 0; i < list2.length; ++i) {
        list2[i].classList.add('needsclick');
    }

没有任何解决方案可以帮助我解决问题。

请问有人在进行修复,请分享。

谢谢。

1 个答案:

答案 0 :(得分:0)

没有来自Google的错误修复程序

因此创建了我自己的自定义自动填充

首先,初始化组件:

this.customAutoComp = new google.maps.places.AutocompleteService(
                {
                    componentRestrictions: { 'country': 'in' }
                });

下一步

 this.customAutoComp.getQueryPredictions({ input: value }, (results, status) => {


                            if (status == google.maps.places.PlacesServiceStatus.OK) {

console.log(results); 
        }
    });

结果将使用UL,LI或任何其他卡片样式填充在UI上。

点击任意地址

public clickAddress(address) {

 var geocoder = new google.maps.Geocoder();

 geocoder.geocode({ 'address': address}, (results, status) => {
            if (status == google.maps.GeocoderStatus.OK) {

 console.log(results);
}
});