$ rootScope недоступен в контроллере

Question

Я действительно сделал $rootScope, доступный при запуске модуля, который полностью доступен из представления, но я хочу получить доступ к этому значению внутри другого контроллера, к сожалению, я не могу получить к нему доступ. Пожалуйста, предложите какой-то способ.

1. Я ранее пытался сделать эти всплывающие параметры datepicker доступными через службу, но не смог это сделать, поскольку я понятия не имею об услугах/фабрике, как их использовать. Что еще более важно, я получаю обновленное значение в представлениях, но то же самое обновленное значение, которое я хочу в моем контроллере, чтобы оно могло быть присвоено переменной переменной. Если кто-то может сделать код ниже для меня внутри службы, а затем, по крайней мере, я получу идею и начну создавать другие инъекционные услуги.

angular.module("TestApp", ["ui.bootstrap"]) 
 
.run(['$rootScope', function ($rootScope) { 
 

 
     $rootScope.clear = function() { 
 
      $rootScope.Date1 = null; 
 
      $rootScope.Date2 = null; 
 
      $rootScope.Date1(); 
 
     }; 
 

 

 
     $rootScope.inlineOptions1 = { 
 
      customClass: getDayClass, 
 
      minDate: new Date(), 
 
      // showWeeks: true 
 

 
     }; 
 

 
     $rootScope.inlineOptions2 = { 
 
      customClass: getDayClass, 
 
      minDate: new Date(), 
 
      // showWeeks: true 
 
     }; 
 

 
     $rootScope.dateOptions1 = { 
 
      //dateDisabled: disabled, 
 
      formatYear: 'yyyy', 
 
      maxDate: new Date(2050, 7, 22), 
 
      minDate: new Date(), 
 

 
      startingDay: 1 
 
     }; 
 

 
     $rootScope.dateOptions2 = { 
 
      //dateDisabled: disabled, 
 
      formatYear: 'yyyy', 
 
      maxDate: new Date(2050, 5, 22), 
 
      minDate: new Date(), 
 

 
      //minDate: new Date($$rootScope.changeMin()), 
 
      startingDay: 1 
 
     }; 
 

 

 
     $rootScope.toggleMin = function() { 
 

 
      $rootScope.inlineOptions1.minDate = $rootScope.inlineOptions1.minDate ? null : new Date(); 
 
      $rootScope.dateOptions1.minDate = $rootScope.inlineOptions1.minDate; 
 

 
      var min2 = new Date(); 
 

 
      $rootScope.$watch('Date1', function() { 
 
       min2 = $rootScope.Date1; 
 
       $rootScope.dateOptions2.minDate = min2; 
 

 
       if ($rootScope.Date1 > $rootScope.Date2) { 
 
        
 
        $rootScope.Date2 = $rootScope.Date1; 
 
        
 
       } 
 
       
 

 
      }, true); 
 

 

 
      $rootScope.$watch('Date2', function() { 
 

 
       if ($rootScope.Date2 < $rootScope.Date1) { 
 
        
 
        $rootScope.Date1 = $rootScope.Date2; 
 
        
 
       } 
 
       
 

 
      }, true); 
 
     }; 
 

 
     $rootScope.toggleMin(); 
 
     $rootScope.open1 = function() { 
 
      $rootScope.popup1.opened = true; 
 
     }; 
 

 
     $rootScope.open2 = function() { 
 
      $rootScope.popup2.opened = true; 
 
     }; 
 

 
     $rootScope.popup1 = { 
 
      opened: false 
 

 
     }; 
 

 
     $rootScope.popup2 = { 
 
      opened: false 
 
     }; 
 

 
     $rootScope.setDate = function (year, month, day) { 
 
      $rootScope.Date1 = new Date(year, month, day); 
 
      $rootScope.Date2 = new Date(year, month, day); 
 

 
     }; 
 

 
     $rootScope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd-MM-yyyy', 'shortDate']; 
 
     $rootScope.format = $rootScope.formats[2]; 
 
     $rootScope.altInputFormats = ['M!/d!/yyyy']; 
 

 
     function getDayClass(data) { 
 
      var date = data.date, 
 
       mode = data.mode; 
 
      if (mode === 'day') { 
 
       var dayToCheck = new Date(date).setHours(0, 0, 0, 0); 
 

 
       for (var i = 0; i < $rootScope.events.length; i++) { 
 
        var currentDay = new Date($rootScope.events[i].date).setHours(0, 0, 0, 0); 
 

 
        if (dayToCheck === currentDay) { 
 
         return $rootScope.events[i].status; 
 
        } 
 
       } 
 
      } 
 

 
      return ''; 
 
     } 
 

 
    }]); 
 

 

 
//This is my Controller 
 

 
angular.module('TestApp').controller('MyDates', ['$scope', '$log', '$rootScope', function ($scope, $log, $rootScope) { 
 

 

 
    $scope.dt1 = $rootScope.Date1; 
 
     
 

 
    
 
    console.log($scope.dt1); //Not showing anything.... 
 
    console.log($rootScope.Date1); 
 
}]);

<script src="~/Scripts/fromscript.js"></script> 
 
<fieldset> 
 
    <form name="MeForm" novalidate> 
 
     <div ng-controller="MyDates"> 
 

 

 

 
      <div class="row"> 
 
       <div class="col-md-3"> 
 
        <div> 
 
         <p class="input-group"> 
 

 
          <input type="text" name="fdate" 
 
            class="form-control" 
 
            uib-datepicker-popup="{{$root.format}}" 
 
            ng-model="$root.Date1" is-open="$root.popup1.opened" 
 
            datepicker-options="$root.dateOptions1" 
 
            ng-required="true" 
 
            close-text="Close" 
 
            alt-input-formats="$root.altInputFormats" /> 
 

 
          <span class="input-group-btn"> 
 
           <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button> 
 
          </span> 
 
         <p class="error validationerror" ng-show="MeForm.fdate.$invalid && MeForm.fdate.$touched">First date is required</p> 
 

 
         </p> 
 
        </div> 
 
        {{Date1 | date: 'dd-MM-yyyy'}} 
 

 

 
        <div> 
 

 
         <p class="input-group"> 
 
          <input type="text" name="ldate" 
 
            class="form-control" 
 
            uib-datepicker-popup="{{$root.format}}" 
 
            ng-model="$root.Date2" is-open="$root.popup2.opened" 
 
            datepicker-options="$root.dateOptions2" 
 
            ng-required="true" 
 
            close-text="Close" 
 
            alt-input-formats="$root.altInputFormats" /> 
 

 
          <span class="input-group-btn"> 
 
           <button type="button" class="btn btn-default" ng-click="open2()"><i class="glyphicon glyphicon-calendar"></i></button> 
 
          </span> 
 
         <p class="error validationerror" ng-show="MeForm.ldate.$invalid && MeForm.ldate.$touched">Last date is required</p> 
 

 
         </p> 
 
        </div> 
 
        {{Date2 | date: 'dd-MM-yyyy'}} 
 
       </div> 
 

 
      </div> 
 

 
     </div> 
 

 
     
 
    </form> 
 
</fieldset>

Answer 1

Это очень простой в использовании сервис. Посмотрите следующий пример.

var testModule = angular.module('testmodule', []); 

testModule 
    .controller('QuestionsStatusController1',['$rootScope', '$scope', 'myservice', function ($rootScope, $scope, myservice) { 
     $scope.myservice = myservice; 
    }]); 

testModule 
    .controller('QuestionsStatusController2',['$rootScope', '$scope', 'myservice',function ($rootScope, $scope, myservice) { 
     $scope.myservice = myservice; 
    }]); 

testModule 
    .service('myservice', function() { 
     this.xxx = "yyy"; 
    }); 

Plunker