如何在AngularJS控制器之间正确共享数据？

debugcn 发表于 Dev

亚姆斯廷普森

请多多包涵。我是Angular的新手，实际上只有一天左右，但是大多数对我来说很有意义。我已经创建了Controllers，routes等，但是放在一起我有点迷失了。

我的问题

我有一个带有的页面ng-view，根据路由的不同，将使用不同的数据和模板来调用不同的控制器。目前，我有一个“列表”页面和一个通过ID路由的“详细”页面，但是我需要两个页面上的列表。

我读过有关使用工厂并将数据相互传递的信息，但这是正确的方法吗？

plopApp.controller('juryCtrl', function($scope, $http) {
$http.get('/assets/javascripts/plop/plop/plopies.json').success(function(data) {
    $scope.plopies = data;
});
});

plopApp.controller('plopDetailCtrl', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
    $http.get('/assets/javascripts/plop/plop/' + $routeParams._id + '.json').success(function(data) {
    $scope.plopor = data;
});
}]);

在详细信息页面上，我也希望输出列表。我是使用工厂执行此操作，还是模板结构不正确？

更新

我要到达那里-我现在了解工厂/服务的基本知识，观看了一两个视频，但在详细页面的执行过程中遇到了麻烦。

这是我在我的应用程序中工作的工厂

juryApp.factory('juryListFactory', function ( $http ) {
return {
    list: function() {
        return $http.get('/assets/javascripts/jury/jury/juries.json')
        .then(
            function(result) {
                return result.data;
        });
    }
};
});

现在我正在尝试转换此控制器的内部：

 juryApp.controller('juryDetailCtrl', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
    $http.get('/assets/javascripts/jury/jury/' + $routeParams._id + '.json').success(function(data) {
    $scope.juror = data;
});
 }]);

到一家工厂..目前我写了这个，但似乎没有用

 juryApp.factory('juryListDetailFactory', '$routeParams', function($http, $routeParam){
var factory = {};
factory.getList = function(list, callback){
    $http.get('/assets/javascripts/jury/jury/' + $routeParams._id + '.json').
    success(function(data){                      
        callback(data)
    }).error(function(){
        /*handle errors however you want */
        callback(false);  
    })};
return factory;
}

我收到此错误错误：[ng：areq]参数'juryDetailCtrl'不是一个函数，未定义

对juryDetailCtrl的任何帮助将不胜感激

卡里姆·阿里（Karim Ali）

从结构的角度来看会更好，如果您从服务或工厂进行$ http.get调用，然后在任何控制器中调用它，例如：

angular.module（'myApp'）

.factory('myFactory', function ($http) {
    return {
        list: function() {
            return $http.get('/myURL/list').then(
                    function(result) {
                        return result.data;
                });
        }
    };
});

然后从控制器：

.controller('myController', ['$scope', 'myFactory',
    function($scope, myFactory) {
        myFactory.list().then(
        function(data){
            $scope.myData = data;
        });
}]);

并从另一个控制器：

.controller('myController2', ['$scope', 'myFactory2',
    function($scope, myFactory2) {
        myFactory2.list().then(
        function(data){
            $scope.myData = data;
        });
}]);

等等..

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。