Question

我有以下结构：

<div id="location" ng-controller="locationController">...</div>
<div id="markerTypes" ng-controller="filterController">...</div>
<div id="map"></div>

地图是谷歌地图，我在工厂创建：

(function (app) {
    'use strict';
    app.factory('emap', function () {
        var center = { lat: 48.2, lng: 2.3 }; 
        var opts = { center: center, zoom: 4 };
        var map = new google.maps.Map(document.getElementById('gmaps'), opts);  
        return map;    
    });

    app.controller('locationController',['$scope', 'emap', 
        function ($scope, emap) {
            // using shared emap
        }]);

    app.controller('filterController',['$scope', 'emap', 
        function ($scope, emap) {
            // using shared emap
        }]);

})(angular.module('mapApp', []));

据我所知，主要有两种方法来共享地图：

通过service（工厂作为只读服务，就像我做的那样）或
通过$rootScope

但是，为了操纵DOM（比方说我用地图做），使用指令的AngularJS文档recommends

不使用控制器：


操纵DOM - 控制器应仅包含业务逻辑。将任何表示逻辑放入控制器会显着影响   它的可测试性。对于大多数情况而言，Angular具有数据绑定    directives 封装手动DOM操作。

我可以在这种情况下使用指令在控制器之间共享地图吗？通过例如：

<div my-map id="map"></div>

Answer 1

指令不应包含数据模型。使用服务或工厂

使用指令在控制器之间共享对象

1 个答案: