ui-gmap-window losing binding on second click angularjs google-maps

Question

The data-bindings in my ui-gmap-windows only works on the first clicked marker(I can open the same marker as many times as I want, but when I click another marker the data binding is lost)

The databinding comes from an object which gets the correct data on any marker clicked it just wont render in the ui-gmap-window.

so to sum it up: the data-binding only works on the first clicked marker.

 $scope.selectedmarker = {};

this is my angular-marker-click code:

//passing in my collection of objects when calling this method then passing through the clicked marker object.
   $scope.addMarkerClickFunction = function (markersArray) {
    angular.forEach(markersArray, function (value, key) {
        value.onClick = function () {
            $scope.onClick(value);
        };
    });
};

   $scope.onClick = function (data) {
    if ($scope.windowOptions.show === true) {
        $scope.windowOptions.show = false;
        $scope.$apply();
    }
    else {
        $scope.selectedmarker = data;
        $scope.$apply();
        $scope.windowOptions.show = true;
    }
};

this is my markup:

<ui-gmap-window coords="selectedmarker.coords" options="windowOptions" closeClick="closeClick()" show="windowOptions.show">
<div style="overflow: auto; width: 300px;">
    <h2 style="font-size: 12px">{{selectedmarker.title}}</h2>
    <h2 style="font-size: 12px">ADRESS:</h2>
    <span>{{selectedmarker.addressStreet}}</span>
    <br/>
    <span>{{selectedmarker.addressZip + ' ' + selectedmarker.addressCity}}</span><br/>
    <span>{{'Telefon: ' + selectedmarker.phoneNumber}}</span><br/>
    <span>{{'E-postadress: ' + selectedmarker.email}}</span>
    <h2 style="font-size: 12px"></h2>
    <span>{{selectedmarker.products}}</span>
</div>

Thanks in advance!

Answer 1

Reworked my code and got it working correctly after finding and following this thread:

Marker click event not firing for ui-gmap-marker in Map Controller