Question

成为Angular框架的新手我使用angularSeed下载启动了我的项目。我有服务和指令工作正常，但今天我需要一个过滤器，我似乎无法让一个工作。

我已将JSFiddle设置为我的设置的基本示例，并注释掉了我的过滤器调用，因为它导致了错误。我只是想过滤掉qty = 0，你的体验会非常感激; ： - ）

<div ng:app="myApp">
 <div ng-controller="myCtrl">
  <!-- div ng-repeat="item in items  | {filter : notZero}" -->
  <div ng-repeat="item in items" >
   <strong>{{item.title}}</strong> {{item.qty}}
  </div>
 </div>
</div>

和JS

angular.module('myApp', [
 'myApp.controllers',
 'myApp.filters'
]);

angular.module('myApp.filters', [])
  .filter('notZero', function() {
   return function( items, condition) {
   console.log( items, condition);
  };
 });

angular.module('myApp.controllers', [])
 .controller('myCtrl', function($scope) {
   $scope.items = [  
    {  
      "title":"40cm",
      "qty":3
   },
   {  
      "title":"55cm",
      "qty":2
  },
  {  
      "title":"60cm",
      "qty":0
  },
  {  
     "title":"70cm",
     "qty":4
  }
];

}）;

Answer 1

修改：

以这种方式定义应用过滤器：

myApp.filter('qtyNotZero', function() { return function(items) { var afterFilter = []; for (var i = 0; i < items.length; i++){ if(item[i].qty != 0) afterFilter.push(item[i]); } return afterFilter; }; });

然后简单地说：

<div ng-repeat="item in items | filter: qtyNotZero>

过滤器应该应用于数量：

<div ng-repeat="item in items | filter: {qty: '!0'}">

或者，如果您有一个更复杂的过滤器，这样您就可以使用自己的逻辑进行过滤：

<div ng-repeat="item in items" | filter: PositiveQty> ... $scope.PositiveQty = function(item) { return item.qty > 0; }

无论如何，你也可以使用：

<div ng-show="item.qty"> <strong>{{item.title}}</strong> {{item.qty}} </div>

Answer 2

有几种方法可以解决这个问题：

您可以将ng-repeat修改为：ng-repeat="item in items|filter:{qty: '!0'}"
编写自己的过滤器，检查qty是否大于零。
使用ng-if：<div ng-if="item.qty > 0"><strong>{{item.title}}</strong> {{item.qty}}</div>

AngularJS过滤器不打球

2 个答案: