Уникальная ng-модель для форм, встроенных в информационное окно (API Карт Google)

Question

При каждом нажатии на карту google я создаю маркер, и каждый маркер имеет информационное окно, которое содержит форму. Но форма на всех информационных окнах заканчивается тем же текстом, который я не хочу. Как создать различные формы с другим текстом?

Вот мой код:

Html

<ng-map center="[40.74, -74.18]" map-type-control-options="{style:'HORIZONTAL_BAR', position:'BOTTOM_CENTER'}" zoom="3" style="height:30em;" on-click="addNewMarker(event)"> 

Javascript:

$scope.all_forms = []; 
$scope.addNewMarker = function(e) 
{ 
    var form = '<div id="form_canvasform" >' + 
        '<form name="form_canvas">' + 
        '<textarea class="form-control" required placeholder="Your Text..." ng-model="mk[$scope.all_forms.length].text">{{all_forms}}</textarea><br/>' + 
        '<button class="btn btn-default" ng-click="uploadNewImageMap()" ng-model="mkimage" id="markerJs">Upload Image</button>' + 
        '<button class="btn btn-default" ng-click="uploadNewVideoMap()" ng-model="mkvideo" id="markerJs3">Upload Video</button><br/>' + 
        '</form>' + 
       '</div>'; 

    var form_compiled = $compile(form)($scope); 

    $scope.all_forms.push(form_compiled); 


    all_infoWindow[markerCounter] = new google.maps.InfoWindow({content:$scope.all_forms[$scope.markerCounter][0]}); 
    all_markers[markerCounter] = new google.maps.Marker({position: e.latLng, map: map, draggable:true}); 

    infoWindow.open(map,marker); // not infoWindow.open(app,marker); 

    google.maps.event.addListener(infoWindow,'closeclick',function(){ 
     marker.setMap(null); 
    }); 

    google.maps.event.addListener(marker, 'position_changed', function() { 
     if(infoWindow.getMap()){ 
      infoWindow.open(map,this); 
     } 
     }); 
     $scope.markerCounter += 1; 
    } 

Изображение:

Любой помощь приветствуется.

Answer 1

Чтение документации, InfoWindow имеет очень ограниченные возможности, если вы хотите настроить его специально для настройки его содержимого.

Я предлагаю вам использовать infobox вместо infowindow.

Как уже упоминалось в этом GitHub пост:

InfoBox ведет себя как google.maps.InfoWindow, но он поддерживает несколько дополнительных свойств для продвинутого моделирования.

С большим количеством свойств по сравнению с опциями, используемыми в infowindow, проще всего проложить содержимое или простое окно, просто передав несколько параметров.

Пожалуйста, проверьте данные GitHub post для примеров кода реализации.

И, наконец, решения, приведенные в этом сообщении SO, - Google Maps API v3: Custom styles for infowindow могут также помочь.