Initially, I set the boolean flag of the infoWindow to false:
$scope.infoWindow = false;
Subsequently, I've added a google maps listener for a click event as shown below:
google.maps.event.addListener(circle, 'click', function(event) {
$scope.toggleInfoWindow();
});
This listener triggers the following function:
$scope.toggleInfoWindow = function() {
$scope.infoWindow = !$scope.infoWindow;
}
Lastly, in my template, I have the following code:
<div ng-show="infoWindow"><h1>Info Window</h1></div>
Although it is expected to display the div whenever the circle is clicked, it seems that it is not responding to the changes in the $scope.infoWindow variable. I have confirmed that the variable is indeed changing by logging its value with console.log() on each click event, verifying the transition from "false" to "true" and vice versa.
What could possibly be causing this issue?