다른 모듈의 컨트롤러간에 데이터를 공유하는 방법

Question

Angular UI Bootstrap Datepicker을 다운로드했으며 해당 범위에 해당 컨트롤러에 액세스해야합니다. 그러나 Datepicker에서 코드를 편집하지 않고 어떻게해야하는지는 전혀 알지 못합니다. 그렇다고 생각합니다.

그래서 난 내 자신의 응용 프로그램/모듈, myApp을 가지고 있고 나는 ui.bootstrap.datepicker 응용 프로그램/모듈에 UibDatepickerController 및 UibDaypickerController에 대한 액세스를 필요로하는 컨트롤러 MyController을 보유하고 있습니다. 그리고 ui.bootstrap.datepicker 모듈의 코드를 변경하고 싶지 않습니다.

이것은 기본적으로 the same problem입니다. 이전에 게시했지만 생각보다 많이 생각했습니다. (이 중 50 시간을 소비했습니다 : D)

This solution 서비스를 삽입 할 수있는 것처럼 컨트롤러를 삽입 할 수 없기 때문에 작동하지 않습니다. 여기

내 디자인의 종류 :

컨트롤러 :

function MyCtrl() { 
var vm = this; 
vm.dt = new Date(); 
vm.options = { 
    ... 
}; 
vm.refresh = function() { 
    //returns initialized value all the time (current date) 
    console.log(vm.dt); 
    $("#calendar").data("$uibDatepickerController").refreshView(); 
} 
}; 
angular.module('myApp') 
    .controller('MyCtrl', MyCtrl); 

HTML : 다음 주입

app.factory('thisfactory',function(){ 
    var data = null; 
    var get = function(){ 
    return data; 
    } 
    var save = function(newData){ 
    data = newData; 
    } 
    return {get:get,save:save} 
}); 

:

<div ng-controller="CalendarCtrl as calCtrl"> 
    <pre>Selected date is: <em>{{calCtrl.dt | date:'fullDate' }}</em> 
    </pre> 
    <div style="display:inline-block"> 
    <div uib-datepicker="" id="calendar" ng-model="calCtrl.dt" datepicker-options="calCtrl.options"></div> 
    </div> 
    <button ng-click="calCtrl.refresh()">Refresh</button> 
</div> 

Answer 1

당신이 같은 서비스 무언가를 만들 공장을 ch 컨트롤러를 사용하여 저장 및 가져 오기 방법을 사용하여 데이터를 앞뒤로 전달합니다.

Answer 2

다른 모듈이나 컨트롤러에서보기에 설정된 값으로 액세스해야하는 경우가 있습니다. 당신은 나일 스가 언급 한 것을 할 수 있습니다. 또는 시계를 설정 한 다음 다른 모듈, 컨트롤러가 값에 액세스 할 수 있도록 브로드 캐스트 할 수 있습니다. 그러나 참조는 할 수 없습니다.

(function(){ 
    angular.controller("testController", testController); 
    angular.controller("otherController", otherController); 

    testController.$inject = ["$scope", "$rootScope"]; 
    otherController.$inject = ["$scope"]; 

    function testController($scope, $rootScope) { 
     var vm = this; 
     $scope.$watch("vm.datePicker", function(newValue){ 
      $rootScope.$broadcast("DATEPICKER_CHANGED", newValue); 
     }); 
    } 

    function otherController($scope) { 
     var vm = this; 

     $scope.$on("DATEPICKER_CHANGED", function(event, obj) { 
      console.log(obj); 
     }); 
    } 
})();