0
Google Maps APIを使いこなしていて、角度を使用していて、APIから変数にデータをバインドしてng-繰り返す。 ng-repeatはplaceオブジェクトのnameプロパティをリストするはずですが、同じzipcodeを2回入力しない限り、それは行いません。ここではHTMLは次のとおりです。送信ボタンが2回クリックされるまでng-repeatが機能しない
<!DOCTYPE html>
<html ng-app = "openApp">
<head>
<meta charset="utf-8">
<title>Open Sesame</title>
<script src = "http://maps.googleapis.com/maps/api/js? key=AIzaSyArO1n-5w8xxPblR_aDxV6Ul1VLik3_pRY&libraries=places"></script>
<script src = "vendors/angular/angular.min.js"></script>
<script src = "assets/scripts/composite.all.min.js"></script>
<link rel = "stylesheet" href = "assets/styles/style.css" />
</head>
<body ng-controller = "MainController as main">
<h1>Is it open?</h1>
<!-- <button ng-click = ""></button> -->
<div id = "googleMap"></div>
<form>
<input type = "text" ng-model = "main.zipcode"/>
<input type = "submit" ng-click = "main.enterZip()" />
</form>
<div id = "displayInfo">
<ul>
<li ng-repeat = "item in main.openPlaces">
test {{item.name}}
</li>
</ul>
</div>
</body>
</html>
、ここでは、クライアント側のJavaScriptです：あなたはJSファイルであなたのコントローラのメインコントローラと名付けので
angular.module('openApp', [])
.controller('MainController', ['$http', function($http){
var vm = this;
vm.latitude;
vm.longitude;
vm.openPlaces = [];
initialize();
vm.enterZip = function(){
$http.get('/zipcodeApi/'+ vm.zipcode)
.then(function(response){
vm.latitude = response.data.lat;
vm.longitude = response.data.lng;
initialize();
})
}
function initialize(){
var mapLocation = new google.maps.LatLng(vm.latitude, vm.longitude);
var openNow = [];
var mapProp = {
center: mapLocation,
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
var placesRequest = {
location: mapLocation,
radius: '2000',
types: ['restaurant'],
keyword: 'restaurant',
};
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(placesRequest, function(results, status) {
if(status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var listedHours = results[i].opening_hours;
if(typeof listedHours != 'undefined' && listedHours.open_now === true){
openNow.push(results[i]);
var place = results[i];
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});
}
}
}
vm.openPlaces = openNow;
})//closes nearbySearch()
}
}]);
hmmm ...私はあなたのコードのほとんどを複製し、Googleマップサービスがやっていることを嘲笑して、私は間違ったコード賢明な何かが表示されません。一番良いことは、ブラウザのdevツールを開いて、enterZip（）。then（）success関数とservice.nearbySearch（）関数の両方でブレークポイントを設定してopenNow配列が初めて埋められているかどうかを調べることです。 – TSmith