在AngularJS中,一个控制器如何从另一个控制器中获取数据

时间:2014-10-28 12:24:03

标签: javascript angularjs

我们正在编写分页编程:

<div ng-controller="panelCtrl">
  <table>
    <tr ng-repeat="item in items | filter:query.name">{{item}}</tr>
  </table>

  <ul ng-controller="paginationCtrl">
    <li ng-repeat="n in range()">
  </ul>
</div>

在我的range功能中,我尝试获取项目金额并将其除以itemsPerpage以获取页码。我想知道如何在过滤后获得物品数量。

提前致谢

2 个答案:

答案 0 :(得分:0)

您可以将已过滤的列表保存在变量中。

<div ng-controller="panelCtrl">
  <table>
    <tr ng-repeat="item in filtered = (items | filter:query.name")>{{item}}</tr>
  </table>

  <ul ng-controller="paginationCtrl">
    <li ng-repeat="n in range()">
  </ul>
</div>

现在,您可以{{filtered.length}}获取长度或将其用作range(filtered.length)的输入。

过滤也可以是可验证的范围,在这种情况下应该在paginationCtrl中可用。

答案 1 :(得分:0)

您可以使用服务在控制器之间进行通信。请参阅下面的解决方案之一。

&#13;
&#13;
var app = angular.module('app', []);
app.factory('dataService', function($filter) {

  var data =

    {
      items: ["Apple", "Banna", "Potato", "Pear"],
      itemsFiltered: []
    }

  return {
    data: data



  };


});

app.controller('homeCtrl', function($scope, filterFilter, dataService) {



  $scope.data = dataService.data;

  $scope.$watch('filtered.length', function(value) {

    dataService.data.itemsFiltered = $scope.filtered;


  })

});

app.controller('paginationCtrl', function($scope, dataService) {


  $scope.data = dataService.data;


})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="homeCtrl">


    <input type="text" ng-model="query.name" />
    <table>
      <tr ng-repeat="item in filtered = (data.items | filter:query.name)">
        <td>{{item}}</td>
      </tr>
    </table>


    <hr/>
  </div>

  <div ng-controller="paginationCtrl">
    <p>Pagination Controller</p>
    <pre> Filtered Array Length: {{data.itemsFiltered.length}}</pre>


  </div>
</div>
&#13;
&#13;
&#13;