Javascript 如何使用jquery滑块过滤ng repeat中的数据?

Javascript 如何使用jquery滑块过滤ng repeat中的数据?,javascript,jquery,json,angularjs,rangeslider,Javascript,Jquery,Json,Angularjs,Rangeslider,我使用的是jquery滑块。 我有来自http的json数据,我使用ng REPLATE指令在页面中显示它。 我想使用如下所示的滑块过滤JSON数据 在图像下,您可以看到两个值185;500这是将ng模型绑定到滑块时得到的值 所以,我的问题是如何使用这个滑块过滤数据 编辑 我更改了我正在使用的滑块,并进行了相同的CSS更改,使其看起来像上面的滑块。 以下是如何使用ng repeat和自定义过滤器来实现这一点。只需在myfilter中使用绑定值并将其替换为min和max,如: <div n

我使用的是jquery滑块。 我有来自http的json数据,我使用ng REPLATE指令在页面中显示它。 我想使用如下所示的滑块过滤JSON数据

在图像下,您可以看到两个值185;500这是将ng模型绑定到滑块时得到的值

所以,我的问题是如何使用这个滑块过滤数据

编辑 我更改了我正在使用的滑块,并进行了相同的CSS更改,使其看起来像上面的滑块。
以下是如何使用
ng repeat
和自定义过滤器来实现这一点。只需在
myfilter
中使用绑定值并将其替换为
min
max
,如:

<div ng-repeat="item in items | myfilter: { min: slider.min, max: slider.max }">

HTML:


{{item.name}

JS:

var-app=angular.module(“app”,[]);
应用控制器('dummy',函数($scope,$sce){
$scope.items=[{name:'hello',成本:100},{name:'world',成本:200}]
});
app.filter('myfilter',function(){
返回函数(项目、条件){
var筛选=[];
如果(条件===未定义| |条件===''){
退货项目;
}
forEach(项,函数(项){
如果(item.cost>=condition.min&&item.cost
<div ng-app="app" ng-controller="dummy">
    <div ng-repeat="item in items | myfilter: { min: 185, max: 500 }">
        <p>{{item.name}}</p>
    </div>
</div>
var app = angular.module("app", []);
app.controller('dummy', function($scope, $sce) {
    $scope.items = [{name: 'hello', cost: 100}, {name: 'world', cost: 200}]
});
app.filter('myfilter', function() {
   return function( items, condition) {
    var filtered = [];

    if(condition === undefined || condition === ''){
      return items;
    }

    angular.forEach(items, function(item) {          
       if(item.cost >= condition.min && item.cost <= condition.max){
         filtered.push(item);
       }
    });

    return filtered;
  };
});