Question

Google api Autocomplete在移动设备中不起作用，但在离子框架中的浏览器中完美运行。在移动设备中，它可以在长按时获取自动值，但不能轻拍。

`var autocompleteFrom = new google.maps.places.Autocomplete（inputFrom，options）; var autocompleteto = new google.maps.places.Autocomplete（inputto，options）;

google.maps.event.addListener(autocompleteFrom, 'place_changed', function() {
    var place = autocompleteFrom.getPlace();
    $rootScope.fromLat = place.geometry.location.lat();
    $rootScope.fromLng = place.geometry.location.lng();
    $rootScope.from = place.formatted_address;
    $scope.placesfrom = $rootScope.from;
    fromlat = $rootScope.fromLat;
    fromlng = $rootScope.fromLng;
    /*var googlemaphome = document.getElementById('googlemap-home');
    var Map = new google.maps.Map(googlemaphome,mapOptions);
    var posfrom = new google.maps.LatLng(fromlat,fromlng);
    var frommarker = new google.maps.Marker({
                    icon: 'img/marker.png',
                    position: posfrom,
                    });
    frommarker.setMap(Map);
    Map.setCenter(posfrom);
    $scope.Map = Map;*/
    var Mapoptions ={
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl:false,
        zoomControl:false,
        draggable:true,
        mapTypeControl:false,
        scaleControl:false,
        streetViewControl:false,
        overviewMapControl:false,
        rotateControl:true
    }
    var bounds = new google.maps.LatLngBounds();
    var googlemaphome = document.getElementById('googlemap-home');
    var Map = new google.maps.Map(googlemaphome,Mapoptions);
    var marker;
    var markers = [
            [fromlat,fromlng],
            [28.6328,77.2197]
    ];

    for(var i = 0; i < markers.length; i++ ) {
        var position = new google.maps.LatLng(markers[i][0], markers[i][1]);
        bounds.extend(position);
        marker = new google.maps.Marker({
            position: position,
            icon: 'img/marker.png',
            map: Map
        });
    }
    Map.fitBounds(bounds);
    x=1;
    checkstatus();
    $scope.$apply();
});

google.maps.event.addListener(autocompleteto, 'place_changed', function() {
    var place = autocompleteto.getPlace();
    $rootScope.toLat = place.geometry.location.lat();
    $rootScope.toLng = place.geometry.location.lng();
    $rootScope.to = place.formatted_address;
    $scope.placesto = $rootScope.to;
    tolat = $rootScope.toLat;
    tolng = $rootScope.toLng;
    y=1;
    checkstatus();
    $scope.$apply();
});
$scope.oncurrent = function(){
    $rootScope.currentpoint = currentpos;
    $rootScope.currentflag = 1;
    $scope.startpoint = currentpos;
    $scope.placesfrom = currentpos;
    geocoder.geocode( { 'address': currentpos}, function(results, status) {
        if(status == google.maps.GeocoderStatus.OK){
                $rootScope.currentlat = results[0].geometry.location.lat();
                $rootScope.currentlng = results[0].geometry.location.lng();
        }
    });
    x=1;
    checkstatus();
};

`

Answer 1

请确保您允许谷歌API通信。也许谷歌的请求被阻止了。也许您的设备上的转接限制比在浏览器中更强

使用

安装白名单插件

ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

然后将此行添加到您的config.xml（建议添加特定网址，但对于测试用例，更容易允许所有内容）

<access origin="*"/>

并且取决于用例，有必要在index.html的标题部分设置正确的Content-Security-Policy。但我认为在你的情况下这不是必要的。

<meta http-equiv="Content-Security-Policy" content=".....">

自动填充功能在移动设备中无效

1 个答案: