Question

如何将数据共享到所有控制器？

我有一个控制器从服务器（file.json）中提取我想要共享给其他控制器的数据

sampleApp.controller('PhoneListCtrl', 
['$scope', '$http', 
function($scope, $http) {
    $http.get('App_Data/phonelist.json').
        success(function(returnDataFrmJson){
            $scope.phonesScope = returnDataFrmJson;
        });
}]);

将访问第一个

的共享数据的控制器

sampleApp.controller('AddIPhoneController', 
['$scope', '$http',
function($scope, $http) { 
    $scope.newInput= 'sample text';

    $scope.sharedText= dataFromSharedControll;
}]);

将显示数据的html文件。

{{newInput}} {{sharedText}}

Answer 1

嗯，您可以使用以下各种选项： $sessionStorage，localStorage，appConstant，$localStorage等等。

您甚至可以使用Factory和Services在控制器之间共享数据。我将为您提供一个使用$sessionStorage.

的简单示例

要使用$sessionStorage或$localStorage，您需要注入ngStorage。

首先在index.html中包含来源：

<script src="https://rawgithub.com/gsklee/ngStorage/master/ngStorage.js"></script>

然后在您的模块定义中，注入ngStorage：

var sampleApp = angular.module('Your App Name', ['ngStorage']);

并且，在controllers：

中

sampleApp.controller('PhoneListCtrl', 
['$scope', '$http', '$sessionStorage',
function($scope, $http,$sessionStorage) {
    $http.get('App_Data/phonelist.json').
        success(function(returnDataFrmJson){
            $scope.phonesScope = returnDataFrmJson;
            $sessionStorage.sharedValue = returnDataFrmJson;//keeping the value in session
        });
}]);

controller将访问第一个

的共享数据

sampleApp.controller('AddIPhoneController', 
['$scope', '$http','$sessionStorage',
function($scope, $http,$sessionStorage) { 
    $scope.newInput= 'sample text';

    $scope.sharedText= $sessionStorage.sharedValue;
}]);

然后在View：

{{newInput}}{{sharedText}}

Answer 2

如果我理解你的问题，你可以创建一个服务并将其注入其他控制器，如：

    sampleApp.service('sharedProperties', function() {
        var sharedText = '';
        return {
            getSharedText: function() {
                return sharedText;
            },
            setSharedText: function(newText) {
                sharedText = newText;
            }
        }
    }

然后在你的控制器中：

    sampleApp.controller('ControllerName', ['sharedProperties', function(sharedPropertied) {
        var text = sharedProperties.getSharedText();
    }]);

显然，您应该通过注入服务并将其设置在另一个控制器中来设置文本。

Answer 3

您应该通过服务共享数据。此外，控制器中的$ http调用应该移动到服务。如果您随后在控制器中注入服务，则可以从控制器中的该服务调用方法/数据。

我建议你看一下John Papa在这里找到的风格指南：https://github.com/angular/angular

Answer 4

您错误地想要在控制器之间共享的数据应存在于服务而不是控制器

中

服务：

 sampleApp.service("MyService",function($http){
       this.phoneList = function(){
             return $http.get('App_Data/phonelist.json');
       };         
 });

控制器1 ：

  sampleApp.controller('PhoneListCtrl1',function($scope,MyService) {
        MyService.phoneList()
           .then(function(list){
                 $scope.phoneList = list;
            });
    });

控制器2 ：

 sampleApp.controller('PhoneListCtrl2',function($scope,MyService) {
            MyService.phoneList()
               .then(function(list){
                     $scope.phoneList = list;
                });
    });

Answer 5

试试$rootScope.phonesScope。这可能有所帮助。 understand rootscope

Answer 6

这取决于要求：

如果您的目的是在没有控制器的情况下共享数据在填充/更新数据时通知控制器，转到采用服务/工厂方法。
如果您还想在通知时通知其他控制器填充/更新数据然后您可以使用角度事件（$广播/ $发射）。
如果您想在页面刷新或浏览器上保留数据关闭，您可以选择会话/本地存储。

在AngularJs中共享数据

6 个答案: