i'm using rangle slider on project. want filter ng-repeat on sliding of range slider. want filter data on price. code html:-
<range-slider min="slider.min" max="slider.max" step="slider.step" lower-value="slider.min" upper-value="slider.max"></range-slider> <div ng-repeat="data in data|filter:rangefilter()"> property: {{data.name}} price: {{data.price}} </div> controller:-
$scope.data = [{ name : hoarding1, price : 50000 }, { name : hoarding2, price : 50000 }, { name : hoarding3, price : 50000 } ] $scope.slider = { step : 10000, min : math.min.apply(math,$scope.data.map(function(item){return item.price;})), max : math.max.apply(math,$scope.data.map(function(item){return item.price;})) } $scope.rangeslider = function (){ return function( items, rangeinfo ) { var filtered = []; var min = parseint(rangeinfo.min); var max = parseint(rangeinfo.max); // if time range angular.foreach(items, function(item) { if( item.price >= min && item.price <= max ) { filtered.push(item); } }); return filtered; }; this not worked me. please me :-(
i think u need custom filter filters particular price , show particular item has filter boundary on price , please see below code
controller :
$scope.rangeinfo = { min : math.min.apply(math,$scope.data.map(function(item){return item.price;})), max : math.max.apply(math,$scope.data.map(function(item){return item.price;})) } template:
<div ng-repeat="data in data | pricerange:rangeinfo"> property: {{data.name}} price: {{data.price}} </div> filter
you can use foreach array method or filter method of array(es5)
app.filter('pricerange',function(){ return function(arrayitems,rangeinfo){ return arrayitems.filter(function(item){ console.log(item.price); return (item.price > rangeinfo.min && item.price < rangeinfo.max); }); } }); es2015 (es6) filter method using arrow functions
app.filter('pricerange',function(){ return function(arrayitems,rangeinfo){ return arrayitems.filter((item) => (item.price > rangeinfo.min && item.price < rangeinfo.max)); } }); 
Comments
Post a Comment