javascript - How to update markers or add new one from within the map-control's controller? -

main html:

<div ng-controller="mapctrl vm">   <ui-gmap-google-map center="vm.map.center" zoom="vm.map.zoom">     <ui-gmap-map-control template="mapcontrol.tpl.html" controller="mapcontrolctrl"></ui-gmap-map-control>     <ui-gmap-marker idkey="vm.marker1.id" coords="vm.marker1.coords"></ui-gmap-marker>   </ui-gmap-google-map> </div> 

mapctrl:

angularapp.controller('mapctrl', function() {   var vm = this;    vm.map = {     zoom: 11,     center: {       latitude: ...,       longitude: ...     }   };    vm.marker1 = {     id: 1,     coords: {       latitude: ...,       longitude: ...     }   }; }); 

mapcontrol.tpl.html:

<button ng-click="addmarker()">add</button> <button ng-click="updatemarker1()">update marker 1</button> 

mapcontrolctrl:

angularapp.controller('mapcontrolctrl', function($scope) {   $scope.addmarker = function() {     // how add marker map within method?   };   $scope.updatemarker1 = function() {     // how update marker1 within method?   }; )}; 

you want use <ui-gmap-markers> takes array of markers instead of 1 in <ui-gmap-marker>

then can push new marker object data array displayed on map