ng-repeat not working until after submit button is hit twice
<p>I am messing with the google maps API and using angular, and I am having an issue binding the data from the API to a variable and displaying it correctly with an ng-repeat. The ng-repeat is supposed to list the name property of the place objects, but it does not do that unless I enter the same zipcode twice. Here is the html:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html ng-app = "openApp"&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;Open Sesame&lt;/title&gt;
    &lt;script src = "http://maps.googleapis.com/maps/api/js?     key=AIzaSyArO1n-5w8xxPblR_aDxV6Ul1VLik3_pRY&amp;libraries=places"&gt;&lt;/script&gt;
    &lt;script src = "vendors/angular/angular.min.js"&gt;&lt;/script&gt;

    &lt;script src = "assets/scripts/composite.all.min.js"&gt;&lt;/script&gt;
    &lt;link rel = "stylesheet" href = "assets/styles/style.css" /&gt;
  &lt;/head&gt;
  &lt;body ng-controller = "MainController as main"&gt;
    &lt;h1&gt;Is it open?&lt;/h1&gt;

    &lt;!-- &lt;button ng-click = ""&gt;&lt;/button&gt; --&gt;
    &lt;div id = "googleMap"&gt;&lt;/div&gt;
    &lt;form&gt;
      &lt;input type = "text" ng-model = "main.zipcode"/&gt;
      &lt;input type = "submit" ng-click = "main.enterZip()" /&gt;
    &lt;/form&gt;

    &lt;div id = "displayInfo"&gt;
      &lt;ul&gt;
        &lt;li ng-repeat = "item in main.openPlaces"&gt;
          test {{item.name}}
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;

  &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>and here is the client side javascript:</p>

<pre><code>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 &lt; results.length; i++) {
                var listedHours = results[i].opening_hours;
                if(typeof listedHours != 'undefined' &amp;&amp;  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()

      }
  }]);
</code></pre>