AngularJS：如何使用服务来检索数据并在控制器之间共享？

Question

我在控制器之间共享数据时遇到问题。

我用2个独立的控制器创建了一个页面。一个带有搜索表单，另一个带有表格以显示搜索结果。

我已经创建了这两个独立的控制器来保持事物的清洁，并让每个控制器处理其各自的屏幕部分。因此，我将处理搜索的逻辑和检索结果的逻辑放入一个注入两个控制器的服务中。 服务的search（）方法用结果设置数据属性，并将result属性设置为控制器内的$ scope属性。

我认为它是这样工作的，但它没有。数据被正确检索并设置为服务属性，但不会反映到控制器属性中。我在这里做错了什么或缺少什么？

任何帮助非常感谢！

代码：两个控制器之间http://jsfiddle.net/0a75uh34/3/

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

app.controller('searchController', [ 
    '$scope', 'searchService', 

function ($scope, searchService) { 
    $scope.search = {}; 
    $scope.data = searchService.data; 

    $scope.submit = function() { 
     searchService.search($scope.search); 
    } 
}]); 

app.controller('searchListController', [ 
    '$scope', 'searchService', 

function ($scope, searchService) { 
    $scope.data = searchService.data; 

    $scope.test = function() { 
     console.log($scope.firms.length); 
    } 
}]); 

app.factory('searchService', [ 
    '$http', 

function ($http) { 

    return { 
     data: [], 

     search: function (params) { 
      var this$ = this; 
      $http.post('/echo/json/', params) 
       .success(function (result) { 
       this$.data = result; 
      }) 
       .error(function() { 
       console.log('Oops...'); 
      }); 
     } 

    } 
}]); 

Answer 1

我设法使用$区间为这个示例显示了完成所需的行为：

var app = angular.module('plunker', []); 

app.factory('ServiceData', function(){ 
    return { 
    data: [1,2,3], 
    search: function() { 
     var this$ = this; 
     this$.data = [1,2,3,5,6,6,7,8,9,];} 
    }; 
}) 

app.controller('MainCtrl', function($scope, $interval, ServiceData) { 
    $interval(function() { 
    $scope.data_list_1 = ServiceData.data; 
    }, 100); 

    $scope.doSearch = function() { ServiceData.search();}; 
}); 

app.controller('SecondCtrl', function($scope, $interval, ServiceData){ 
    $interval(function() { 
    $scope.data_list_2 = ServiceData.data; 
    }, 100); 
}); 

Plunkr这里：http://plnkr.co/edit/A75rTb

Answer 2

共享数据的乐趣。 首先，您需要使用工厂/服务模式创建服务。

var app = angular.module('plunker', []); 

app.factory('ServiceData', function(){ 
    return {data:[1,2,3,5,6,6,7,8,9,9,0]}; 
}); 

比你可以在任何控制器注入此服务，无论你创建多少控制器！

app.controller('MainCtrl', function($scope, ServiceData) { 
    $scope.data = ServiceData.data; 
}); 

app.controller('SecondCtrl', function($scope, ServiceData){ 
    $scope.data = ServiceData.data; 
}); 

这里工作plunker