angularjs - ng重复内的 Angular ng重复过滤器

Question

我一直在尝试制作一个地理区域列表，每个区域都有一些税款(并非所有税款都适用于所有地理区域)。

所以我为 geozones 做了一个 ng-repeat，在每个 geozones 里面做了一个 ng-repeat 和所有的税。问题是我目前不知道如何发送正在过滤的地理区域的 ID。这是现在的代码:

<md-option ng-repeat="tax in taxClasses | filter: filterTax" value="{{ '{{ tax.id }}' }}">{{ '{{ tax.name }}' }}</md-option>

和JS:

$scope.filterTax = function(tax, n){

        angular.forEach(tax.geoZone , function(geo){
           if(geo === $scope.prices[n].geozoneId){
               return true;
           } 
        });
        return false;
    };

需要 n 是地理区域的索引，或者类似的东西。提前致谢!

Answer 1

你的想法并不遥远，但使用 filter:甚至没有必要，因为管道 |已经是 filter命令:

ng-repeat="<var> in <array> | <filterFunction>:<...arguments>"

因此，您可以创建一个过滤器(有关详细信息，请参阅 https://docs.angularjs.org/guide/filter)

ng-repeat="tax in taxClasses | filterTax: <geozoneIndex>"

集合的值将作为您的 filterTax 的第一个参数传递。功能。任何进一步的参数都以冒号分隔传递 : .

当你使用它时，你必须像这样传播一个过滤器方法:

app.module(...).filter('filterTax', function(/* injected services */) {
  return function (/* arguments */ input, geozoneIndex) {
    // function body
  }
});

或者使用您范围中的过滤器功能:

// template
ng-repeat="tax in filterTaxes(taxClasses, <geozoneIndex>)"

// script
$scope.filterTaxes = function(taxClasses, geozoneIndex) {
  // do the whole filtering, but return an array of matches
  return taxClasses.filter(function(taxClass) {
    return /* in or out code */;
  });
};

这意味着您的 geozoneIndex可以是固定值或从变量中提取，在该范围内可用。

请注意您的 filterTax函数将被调用 很多 ，因此如果您的页面变慢，您可能需要考虑优化该过滤。