Javascript $rootScope并将数据从控制器传递到服务

我用的是angular js，有一个像这样的控制器

myApp = angular.module("myApp.controllers", []);
myApp.controller("ScheduleCtrl", function($scope, $http, ScheduleService){
    $scope.hours = 4;
    ScheduleService.test();
    ScheduleService.initializeSchedule();
});

myApp = angular.module('myApp.services', []);
myApp.factory('ScheduleService', ['$rootScope', function($rootScope){

    return {
        test : 
            function(){
                alert("Test");
            },
        initializeSchedule : 
            function(){
                alert($rootScope.hours);
            }
    };
});

还有一个服务（在另一个文件中）看起来像这样

myApp = angular.module("myApp.controllers", []);
myApp.controller("ScheduleCtrl", function($scope, $http, ScheduleService){
    $scope.hours = 4;
    ScheduleService.test();
    ScheduleService.initializeSchedule();
});

myApp = angular.module('myApp.services', []);
myApp.factory('ScheduleService', ['$rootScope', function($rootScope){

    return {
        test : 
            function(){
                alert("Test");
            },
        initializeSchedule : 
            function(){
                alert($rootScope.hours);
            }
    };
});

为了确保每个人都能正确地从服务连接到控制器，控制器中对“test（）”的第一次调用会在警报框中生成所需的输出。然而，对于下一个函数，现在应该是警告“4”，而不是警告“未定义”

---

如何使用$rootScope或其他工具来将范围变量用于我的服务

您需要将

$rootScope

注入控制器，并使用

$rootScope

而不是

$scope.

myApp.controller("ScheduleCtrl", function($scope, $rootScope, $http, ScheduleService){
    $rootScope.hours = 4;
    ScheduleService.test();
    ScheduleService.initializeSchedule();
});

但在这种情况下，您不需要使用

$rootScope。

只需将数据作为参数传递给服务函数即可

return {
    test : 
        function(){
            alert("Test");
        },
    initializeSchedule : 
        function(hours){
            alert(hours);
        }
};

---

问题是$scope是为控制器创建的一个独立作用域。如果希望$rootScope显示在服务中，则需要将其注入控制器并修改其上的小时数

请参阅有关作用域层次结构的详细信息

控制器：

angular.module('myApp', []).controller('ExampleController', ['$scope', '$rootScope', 'ScheduleService', function($scope, $rootScope, ScheduleService) {
  $scope.hours = 4;
  $rootScope.hours = 42;
  ScheduleService.test();
  ScheduleService.initializeSchedule();
}]);

服务：

angular.module('myApp')
.factory('ScheduleService', function($rootScope) {
  return {
        test : 
            function(){
                alert("Test");
            },
        initializeSchedule : 
            function(childScopeHours){
                alert($rootScope.hours);
            }
    };
});

---

如何在控制器和视图中使用Angular$rootScope

要在应用程序控制器之间共享全局属性，可以使用Angular$rootScope。这是共享数据的另一个选项

跨控制器共享公共功能的首选方法是服务，即读取或更改可以使用$rootscope的全局属性

所有其他作用域都是根作用域的子作用域，所以明智地使用$rootScope

var app = angular.module('mymodule',[]);
app.controller('Ctrl1', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = true;
}]);

app.controller('Ctrl2', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = false;
}]);

在模板中使用$rootScope（使用$root访问属性）：