CODEWITHSUNDEEP
angularjsgoogle-maps-api-3google-maps-markers
EricP
EricP

Reputation: 1449

Angular JS uiGmapgoogle-maps add marker after map is loaded

I am able to add markers when initially loaded in AngularJS, but when I try pushing another marker after it does not add it. Here is my Plunker

$scope.addMarkerLocation = function(){
  console.log('adding m');

  var m = 
      {
        id: 3,
        //icon: 'assets/img/blue_marker.png',
        latitude: 25.686384,
        longitude: -80.311644,
        showWindow: false,
        title: 'Jimmyz Kitchen Pinecrest',
        address: '9050 S Dixie Hwy Miami, FL 33156'
      };
  $scope.markers.push(m);
  console.log(m);
}

Upvotes: 0

Views: 1137

Answers (1)

maurycy
maurycy

Reputation: 8465

The problem is that you create google maps in one instance of mainCtrl and then you add another marker in other instance, they don't share the same scope, therefore first instance is unaware of changes, you can either use the button in the same context or use service

angular.module('appMaps').factory('markers', function markers () {
    return {
      currentMarkers: []
    }
  })

http://plnkr.co/edit/kKbEB2ZSHgWQWnCTIvHg?p=preview

Upvotes: 1

Related Questions