I have made the decision to utilize the AngularUI Map plugin for displaying Google Maps within a specific view.
Here is how the template is structured:
<div id="map">
<div ui-map="map" ui-options="mapOptions" id="map-canvas"
ui-event="{'map-click': 'placeMarker($event, $params)'}">
</div>
</div>
The map is kept within the map scope variable of the controller. I have manually set this variable in the controller by declaring: #scope.map = {};
My goal is to move this map object to a service so that it is not recreated each time the view is accessed.
The service I have created appears as follows:
evee.factory('mapService', [function () {
return {
};
}]);
Below is the snippet of the controller code:
var LocationController = function($scope, mapService) {
$scope.map = mapService;
...
Unfortunately, I am unable to get it to function as desired, as the plugin keeps reinitializing the map. Should I consider abandoning the plugin and exploring an alternative approach like this non-plugin solution ?
Thank you.