Question

我正在尝试构建一个包含全屏地图和侧边栏的Angular应用程序。

我目前有一个设置地图的MapController，然后我有一个PlacesController用于列出侧边栏中的地方。如果我现在想通过单击侧栏中的链接向地图添加标记，应该如何处理？

我的想法： PlacesController有一个名为addMarker的函数，它在一个使用“$ rootScope。$ broadcast（'addMarker'）;”广播“addMarker”的服务中调用另一个名为addMarker的函数。 MapController监听，然后在MapController中调用“addMarker”，实际上将标记添加到地图中。

有更简单/更好的方法吗？

Answer 1

您应该拥有一些服务中包含的数据，以便在更改时通知任何侦听器。修改以下是展示此方法的jsBin

观察者模式对这个有好处：

app.factory('MapService', function() {
  var observerCallbacks = [];
  var markers = [];

  var publicMembers = {
    addMarker: addMarker,
    getMarkers: getMarkers,
    registerObserverCallback: registerObserverCallback
  }

  function addMarker (marker) {
     markers.push(marker);
     notifyObservers();
  };

  function getMarkers() {
     return markers;
  }

  function registerObserverCallback(callback){
    observerCallbacks.push(callback);
  };

  function notifyObservers(){
    angular.forEach(observerCallbacks, function(callback){
      callback();
    });
  };

  return publicMembers;
});

然后在您的控制器中，您可以注入此服务，注册为观察者，并且每当通知观察者时（例如，在addMarker中，您的回调将被执行：

app.controller('MyController', function($scope, MapService) {
    MapService.registerObserverCallback(function() {
        $scope.markers = MapService.getMarkers();
    });
});

我该如何处理控制器之间的函数调用？

1 个答案: