4

I may be asking the same question as Similar q, but I'm not sure!

Basically I have code to add markers to a Google map. Then an infowindow displays. How can I put a form in here that has elements binding to the scope of a module? Angular is running ok on the rest of the page (I have a simple expressions to test this), but it's not running in the form as {{text}} never changes.

var html =
"<form id=\"markerInput\" ng-controller=\"markerCtrl\">"+
"<input ng-model=\"text\">{{text}}</form>";

infowindow = new google.maps.InfoWindow();

google.maps.event.addListener(map, "click", function(event) {
  marker = new google.maps.Marker({
    position: event.latLng,
    map: map
  });
  google.maps.event.addListener(marker, "click", function() {
    infowindow.setContent(html);
    infowindow.open(map, marker);
  });
});
Community
  • 1
  • 1
jthompson
  • 229
  • 2
  • 15

1 Answers1

0

I know this is an old question but I recently come across this problem and had trouble finding relevant info so it can definately help somebody out there, I fixed it using .$apply to read more please visit this link http://jimhoskins.com/2012/12/17/angularjs-and-apply.html

Immutable Brick
  • 830
  • 12
  • 23
  • 1
    I am still not able to resolve the problem, do you have any demo code for this? – jain Feb 13 '16 at 17:57
  • I have created a js object, did all the logic I need on the `click listener` and then used `apply` to force Angular to update, prob not very useful but below you can find parts of the code I used `google.maps.event.addListener(marker, 'click', function(){ Map.setMarker(marker.cleanTitle); Map.setPlace(marker.location); Map.loadMarker(); $scope.$apply(); });` – Immutable Brick Feb 15 '16 at 08:54