Question

我使用角度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);
            }
    };
});

为了向所有人保证从服务到控制器的连接正确，第一次调用＆＃34; test（）＆＃34;在我的控制器内部，在警告框中生成所需的输出。但是，对于下一个功能，现在应该警告＆＃34; 4＆＃34;，而是警告＆＃34; undefined＆＃34;。

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

Answer 1

您需要将$rootScope注入您的控制器并使用$rootScope代替$scope. DEMO

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);
        }
};

Answer 2

如何在控制器中使用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访问属性）：

<div ng-controller="Ctrl1">
    <div class="banner" ng-show="$root.showBanner"> </div>
</div>

Answer 3

问题是$ scope是为您的控制器创建的隔离范围。您需要将$ rootScope注入控制器并根据需要修改数小时，以便在服务中显示。

详细了解范围层次结构here.

控制器：

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);
            }
    };
});

工作plnkr.

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

3 个答案: