title: Adding Multiple Markers to Angular-google-maps
body: <p>I am having the hardest time getting my angular project to display multiple map markers. I have a service called retsAPI where I am querying a local MLS  database for home listings. I am trying to display these items on a google mapes. Here is my controller.</p>
  
  <pre><code>function retsMapController($scope, uiGmapGoogleMapApi, uiGmapIsReady, retsAPI) {
  $scope.map = {
      center: {
          latitude: 43.6376107,
          longitude: -116.314943
      },
      zoom: 10
  };
  $scope.options = {
          scrollwheel: false,
          streetViewControl: false,
          mapTypeControl: false,
          scaleControl: false,
          rotateControl: false,
          zoomControl: false
  };
  
  $scope.markers = [];
  uiGmapIsReady.promise()
      .then(function (instances) {
          console.log(instances[0].map);
      })
      .then(function () {
          retsAPI.default().success(function(result) {
              $scope.results = result;
              var i = 0;
                 result.forEach(function(item) {
                     $scope.markers.push({
                        id: Date.now()+i,
                         coords: {
                             latitude: item['LMD_MP_Latitude'],
                             longitude: item['LMD_MP_Longitude']
                         }
                     });
                 i++;
              });
              console.log("MARKER: ", $scope.markers);
      });
  
  
  });
  uiGmapGoogleMapApi.then(function (maps) {
      angular.extend($scope.map, {
          options: {
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              zoomControlOptions: {
                  style: google.maps.ZoomControlStyle.LARGE,
                  position: google.maps.ControlPosition.LEFT_CENTER
              }
          }
      });
  });
  </code></pre>
  
  <p>Here is my HTML file.</p>
  
  <pre><code>&lt;div id="real_angular" ng-controller="retsMap" ng-app="real_angular"&gt;
  &lt;div rets-search-form&gt;&lt;/div&gt;
  {{ markers }}
  &lt;ui-gmap-google-map
      ng-if="map.center"
      center='map.center'
      zoom='map.zoom'
      options='options'
      refresh="true"&gt;
      &lt;ui-gmap-markers
          models="markers"
          coords="'self'"
          icon="'icon'"&gt;
      &lt;/ui-gmap-markers&gt;
  &lt;/ui-gmap-google-map&gt;
  </code></pre>
  
  <p>and this is the result of $scope.markers</p>
  
  <pre><code>[{"id":1481596995980,"coords":{"latitude":"43.7335624694824","longitude":"-116.400283813477"}},{"id":1481596995981,"coords":{"latitude":"44.9327393","longitude":"-116.0692291"}},{"id":1481596995982,"coords":{"latitude":"44.846809387207","longitude":"-116.179756164551"}},{"id":1481596995983,"coords":{"latitude":"44.0762062072754","longitude":"-116.978248596191"}},{"id":1481596995984,"coords":{"latitude":"44.6780061721802","longitude":"-116.120807826519"}},{"id":1481596995985,"coords":{"latitude":"44.8671951293945","longitude":"-116.026954650879"}},{"id":1481596995986,"coords":{"latitude":"43.0574607849121","longitude":"-114.13264465332"}},{"id":1481596995987,"coords":{"latitude":"43.7259407043457","longitude":"-116.800910949707"}},{"id":1481596995988,"coords":{"latitude":"42.55171340147","longitude":"-114.460141584277"}},{"id":1481596995989,"coords":{"latitude":"44.3812294006348","longitude":"-115.982734680176"}},{"id":1481596995990,"coords":{"latitude":"42.9506072998047","longitude":"-115.298492431641"}},{"id":1481596995991,"coords":{"latitude":"42.5505142211914","longitude":"-114.454963684082"}},{"id":1481596995992,"coords":{"latitude":"43.677565","longitude":"-116.0496032"}},{"id":1481596995993,"coords":{"latitude":"44.2447853088379","longitude":"-116.953323364258"}},{"id":1481596995994,"coords":{"latitude":"43.5853805541992","longitude":"-116.189315795898"}},{"id":1481596995995,"coords":{"latitude":"43.6678466796875","longitude":"-116.680221557617"}},{"id":1481596995996,"coords":{"latitude":"43.6502661556005","longitude":"-116.251468285918"}},{"id":1481596995997,"coords":{"latitude":"43.6551094055176","longitude":"-116.685394287109"}},{"id":1481596995998,"coords":{"latitude":"44.5916213989258","longitude":"-116.669593811035"}},{"id":1481596995999,"coords":{"latitude":"42.6074829101563","longitude":"-114.768821716309"}}]
  </code></pre>
  
  <p>it also appears that i have lost my google controls. I am not sure what happened to make those disappear.</p>