Angularjs: more than a filter with ng-repeat

Question

I am applying a larger filter to the ng-repeat tag. I wrote the following custom filter function:

$scope.priceRangeFilter = function (location) { return location.price >= $scope.minPrice; }; 

and I use it in the following HTML:

 <div ng-repeat="m in map.markers | filter:priceRangeFilter"> 

What is the best way to trigger an update of the ng-repeat tag when updating $ scope.minPrice?

Answer 1

It must be automatic. When $scope.minPrice relay will automatically update.

 function Ctrl($scope, $timeout) { $scope.map = [{ name: 'map1', price: 1 }, { name: 'map2', price: 2 }, { name: 'map3', price: 3 }]; $scope.minPrice = 0; $scope.priceRangeFilter = function (location) { return location.price >= $scope.minPrice; }; $timeout(function () { $scope.minPrice = 1.5; }, 2000); } 

Demo on jsFiddle

Answer 2

Create a filter as a filter service using the angularjs api filter and add minPrice as a parameter.

 filter('priceRangeFilter', function ( location ) { return function ( location, minPrice ) { ... } }) 

and in the template

 <div ng-repeat="m in map.markers | priceRangeFilter:minPrice"> 

See an example in this script: http://jsfiddle.net/Zmetser/BNNSp/1/