javascript - ng-repeat not working until after submit button is hit twice -


i messing google maps api , using angular, , having issue binding data api variable , displaying correctly ng-repeat. ng-repeat supposed list name property of place objects, not unless enter same zipcode twice. here html:

<!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 main">     <h1>is 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> 

and here client side javascript:

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) {               (var = 0; < 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()        }   }]); 

maincontroller work because named controller maincontroller in js file. , that's same reason maincontroller main won't work.


Comments

Popular posts from this blog

javascript - Slick Slider width recalculation -

jsf - PrimeFaces Datatable - What is f:facet actually doing? -

angular2 services - Angular 2 RC 4 Http post not firing -