Question

在我的应用程序中，我使用指令gm-places-autocomplete对Google地方使用自动填充功能。我希望使用我的自定义数组增强此自动完成建议，该数组已在下面列出，具有现有的自动完成功能。下面显示的是我的HTML

  <input type="text" gm-places-autocomplete ng-model="autocomplete" class="form-control" id="autoCompleteText" />

我有一个自定义数组，其中包含以下详细信息。

      var arrayPlaces={[name:"myHome", lat:25.56,lng:56.12],[name:"office",lat:25.36,lng:51.25]}

我想将此自定义数组包含在我的自动填充建议中。有没有办法实现这个。

除了angular JS之外，还有其他使用Javascript或Jquery的方式。

先谢谢

Answer 1

这是一个适合您情况的javascript方式。自动完成结果可在AutocompleteService.getQueryPredictions的回调中编辑。获得自动完成结果后，您可以在显示结果之前添加自己的结果。

function initService() {
  var displaySuggestions = function(predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK) {
      alert(status);
      return;
    }

    // add your custom suggestion here
    // add to end
    predictions.push({description: 'custom suggestion 2'});
    // add to head
    predictions.unshift({description: 'custome suggestion 1'});

    predictions.forEach(function(prediction) {
      //console.log(prediction);
      var li = document.createElement('li');
      li.appendChild(document.createTextNode(prediction.description));
      document.getElementById('results').appendChild(li);
    });
  };

  var service = new google.maps.places.AutocompleteService();
  service.getQueryPredictions({
    input: 'pizza near Syd'
  }, displaySuggestions);
}

<div id="right-panel">
  <p>Query suggestions for 'pizza near Syd':</p>
  <ul id="results"></ul>
</div>
<!-- Replace the value of the key parameter with your own API key. -->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=places&callback=initService" async defer></script>

将自定义数组添加到Google自动填充位置angularJS

1 个答案: