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

问题描述：

我试图构建一个由全屏地图和边栏组成的Angular应用程序。我应该如何处理控制器之间的函数调用？

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

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

有没有更容易/更好的方法来做到这一点？

移动的代码，使用地图的服务，并使用该服务在两个控制器你的想法左右。非常糟糕。 – 2014-08-30 21:35:48

答

您应该将某些服务中包含的数据全部包含在通知任何监听者更改时的服务中。编辑这里是一个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(); 
    }); 
});

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

相关推荐