title: Angular google maps windows not showing
body: <p>Other than the Polling, I cannot get the windows to show when I'm adding points manually to the map. Only if the array of markers is pre-populated, will it work. If the array has, say, 1 marker pre-populated, and then I manually add a second marker after the map loads, the first marker will show the window, but the second one won't. It's the same marker with different lat/lng. As far as I can tell, I have my code nearly identical to this plunker with the exeption being I'm not polling for data.</p>
  
  <p><a href="http://plnkr.co/edit/nbX0BIxNhxFrpzpruRWb?p=preview" rel="nofollow">http://plnkr.co/edit/nbX0BIxNhxFrpzpruRWb?p=preview</a></p>
  
  <pre><code>http://54.210.49.244:4000/gMaps
  </code></pre>
  
  <p>Personal site I'm using for luls. Yes, I'm too lazy to get a real domain. It's free, ok XD 
  Demonstrates the issue. Does not support IE 9 or less.</p>
  
  <p>This is the controller logic.</p>
  
  <pre><code>.controller("gMapsController", ["$scope", '$location', function($scope, $location){
      $scope.welcomeMessage = "Welcome to Google Maps Playground"
  
      $scope.map = {
          center: {
              latitude: 44.41748017333282,
              longitude: 26.106005249023376
          },
          zoom: 12
      }
      $scope.id = 0;
      $scope.map.bounds = {};
      $scope.map.randomMarkers = [{
          id: 0,
          latitude: 44.42138408826953,
          longitude: 26.25385948707207,
          showWindow: false,
          title: "m9"
      },
          {
          id: 1,
          latitude: 44.39138408826953,
          longitude: 26.21385948707207,
          showWindow: false,
          title: "m9"
      }];
  
      $scope.id++;
      $scope.id++;
      $scope.id++;
  
      angular.forEach($scope.map.randomMarkers, function(marker) {
          marker.showWindow = false;
  
          marker.onClick = function() {
              console.log('on click - opening window');
              marker.showWindow = true;
              $scope.$apply();
          }
  
          marker.closeClick = function() {
              console.log('close click - hiding window');
              marker.showWindow = false;
              $scope.$apply();
          }
  
          console.log(marker);
  
      });
  
  
      var generateMarkers = function(markers) {
  
  
          markers.showWindow = false;
  
          markers.onClick = function() {
                  console.log('on click - opening window');
                  markers.showWindow = true;
                  $scope.$apply();
              };
  
          markers.closeClick = function() {
                  console.log('close click - hiding window');
                  marker.showWindow = false;
                  $scope.$apply();
              };
  
              console.log(markers);
  
  
          $scope.map.randomMarkers.push(markers);
  
      };
  
      $scope.generateMarker = function(){
          var marker = {
              id: $scope.id,
              latitude: 44.41138408826953,
              longitude: 26.23385948707207,
              showWindow: false,
              title: "m9",
              draggable: true
          };
          console.log("marker added");
          generateMarkers(marker);
          $scope.id++;
      };
  </code></pre>
  
  <p>The view</p>
  
  <pre><code>div.container
      button(type = "button", ng-click="generateMarker()") Add a Marker
      div.row()
          div(class = "col-md-6")
              google-map(center="map.center", zoom="map.zoom", draggable="true", bounds="map.bounds", control="map.control")
                  markers(models="map.randomMarkers", coords="'self'", icon="'icon'", click="'onClick'")
                      windows(show="'showWindow'", closeClick="'closeClick'", ng-cloak)
                          div
                              | Window with additional information
  </code></pre>