javascript - 最小值和最大值的 Angular 滤波器

我在获取角度以正确过滤我的结果时遇到了一些麻烦。我试图使用一个自定义过滤器，该过滤器从最小输入和最大输入获取参数。

/index.html

<input ng-model="minHorsepower">
<input ng-model="maxHorsepower">
...
tr(ng-repeat="plane in planes | filter:horsepowerFilter")

/controllers.js

//Horsepower filter
$scope.horsepowerFilter = function(plane) {
  var ret = true;

  if($scope.minHorsepower && $scope.minHorsepower > plane.horsepower) {
    ret = false;
  }

  if($scope.maxHorsepower && $scope.maxHorsepower < plane.horsepower) {
    ret = false;
  }

  return ret;
};

$scope.planes = [
  {
      'make' : 'Piper',
      'model' : 'Arrow',
      'modelNumber' : 'PA-28R-180',
      'horsepower' : '180',
      'gear' : 'retractable',
  },
  {
      'make' : 'Piper',
      'model' : 'Arrow',
      'modelNumber' : 'PA-28R-200',
      'horsepower' : '200',
      'gear' : 'retractable',
  }
];

当我在controllers.js中设置$ scope.minHorsepower / $ scope.maxHorsepower时，它最初有效，但仅在最初时有效，而当我在<input>中放入其他内容时则无效。此外，它会预填充输入并过滤结果。当我更改输入值时，它只是无法正常工作。

我已经引用了这个Stack Overflow线程，但是在我们的代码中找不到任何实质性的区别... AngularJS multiple filter with custom filter function

谢谢您的帮助。

最佳答案

不幸的是，我无法确切指出您的代码所遇到的问题。但是，我认为我创建了（我认为）可以正常工作的a plnkr。

除了使用parseFloat解析输入之外，逻辑似乎是相同的。不将输入解析为数字形式不应“破坏”它，但可能会使它的行为异常（例如“ 9”>“ 10”）。

无论如何，希望您可以抽出有用的部分并使它正常工作。

关于javascript - 最小值和最大值的 Angular 滤波器，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21103207/