在 google 自动完成列表中添加最喜欢的位置

Question

有没有办法向 Google 自动完成添加额外的位置。

我需要在我的 'favorite locations' 列表中进行搜索，并将该列表中的位置置于搜索结果的顶部。

请找到我用于 google 自动完成的代码片段。

let autocomplete = new google.maps.places.Autocomplete(elementRef, {
    componentRestrictions: { country: 'KW' }
});

我正在研究 angular 4. 谁能指导我？

谢谢！

Answer 1

您可以使用 AutocompleteService class 并构建您自己的建议列表。

function initialize() {

    var search = 'Boston, MA';
    
    var service = new google.maps.places.AutocompleteService();
    service.getPlacePredictions({
        input: search,
        types: ['establishment', 'geocode']
    }, callback);
}

function callback(predictions, status) {

    if (status != google.maps.places.PlacesServiceStatus.OK) {
        alert(status);
        return;
    }

    var results = document.getElementById('results');

    for (var i = 0, prediction; prediction = predictions[i]; i++) {
        results.innerHTML += '<li><div class="result"><h3>' + prediction.description + '</h3>' + JSON.stringify(prediction) + '</div></li>';
    }
}

.result {
 padding: 10px;
 border: 1px solid black;
 margin-bottom: 10px;
}

<p>Query suggestions:</p>
<ul id="results"></ul>

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&callback=initialize&key= AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"
        async defer></script>

然后由您根据需要设置样式并在列表中打印您想要的内容。如您所见，在 callback 函数中很容易将收藏夹推到顶部。

在 google 自动完成列表中添加最喜欢的位置

Adding favorite location in google autocomplete list

google-maps-api-3

google-location-services

angular