컨트롤러간에 함수 호출을 어떻게 처리해야합니까?

Question

전체 화면지도와 사이드 바를 포함하는 각도 앱을 만들려고합니다.

현재 맵을 설정하는 MapController가 있으며 사이드 바에 장소를 나열하는 PlacesController가 있습니다. 사이드 바에있는 링크를 클릭하여지도에 마커를 추가하려면 어떻게 처리해야합니까?

내 아이디어 : PlacesController는 "$ rootScope. $ broadcast ('addMarker');"를 사용하여 "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(); 
    }); 
});