angularjs嵌套ng重复的子长度以外的ng重复

问题描述：

我有一个嵌套的ng重复，并试图使用过滤嵌套的ng重复以外的父ng-repeat的长度。然而，结果总是0，如果它是一个单一的ng-repeat我可以得到结果。我试过$ parent.filtered，但它得到错误的结果。下面angularjs嵌套ng重复的子长度以外的ng重复

例如：

<div> 
      Filtered Count :{{filtered.length}} 
      <div ng-repeat="group in groups"> 
       <div ng-repeat="letter in filtered = (group.letters | filter:filters.search) | orderBy:orderByAttribute:sortReverse "> 

       </div> 
      </div> 

     </div>

THX，

这并没有多大意义，创造了小提琴此代码。您有几个组，每个组都有不同数量的过滤字母。应显示哪些数字？ –

你应该已经完成了所有这些在你的控制器 –

我需要的总过滤器 –

答

filtered在ng-repeat指令范围创建的，即分离物范围。

该属性是不从外部范围访问，它就像试图从outerscope访问ng-repeat的$index财产。

你可以做什么它的过滤数组绑定到一个对象的外部范围（例如，在模板的控制器）

$scope.parent = {}

然后过滤，家长指令追加内部，以便有一个钩从外面过滤。

<div ng-repeat="letter in parent.filtered = (group.letters | filter:filters.search) | orderBy:orderByAttribute:sortReverse "> 

</div>

然后是在父范围

Filtered Count :{{parent.filtered.length}}

DOC：angular ng-repeat

ngRepeat指令创建新的范围

工程伟大的BU而不是var父母，我不得不使用$ scope.parent = {}; Thx –

事情是，它不会得到过滤的总数，它会得到父母ng内的索引总数 –

@DanyNA我的意思是$ scope.parent，只是修复它:)。父对象是一个钩子，它允许你看到过滤的内容，你应该能够得到与内容一起的项目总数。 – Karim

答

通过seenimurugan给出的原始答案将是here和我已经更新了他的小提琴，使其动态。工作example

<div class="section" ng-app="phonecatApp" ng-controller="PhoneListCtrl"> 
    <div class="slide"> 
     <div class="container"> 
      <h2 class="section-title">Selected Mobiles</h2> 
     </div> 
     <div class="container-fluid fix ver2"> 
      <div class="col-md-3 work-thumb" ng-repeat="phone in phones"> 
       {{setCount($index)}} 
       <a href="#">{{phone.name}}</a> 
      </div> 
     </div> 
    </div> 
    <p>Count: {{count}}</p> 
</div>

@Contrller

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

phonecatApp.controller('PhoneListCtrl', function($scope) { 
    $scope.count = 0; 
    $scope.phones = [{ 
      'name': 'Nexus S', 
      'snippet': 'Fast just got faster with Nexus S.' 
     }, 
     { 
      'name': 'Motorola XOOM™ with Wi-Fi', 
      'snippet': 'The Next, Next Generation tablet.' 
     }, 
     { 
      'name': 'MOTOROLA XOOM™', 
      'snippet': 'The Next, Next Generation tablet.' 
     } 
    ]; 
});

我用从seenimurugan在原来的答案

angularjs嵌套ng重复的子长度以外的ng重复

相关推荐