創建角度過濾器功能的問題

我正在嘗試使用複選框值來過濾結果。我需要能夠按評分過濾。這是我到目前爲止的代碼：創建角度過濾器功能的問題

<label ng-repeat="rating in ratings"> 
     <input type="checkbox" value="{{rating.value}}" ng-model="rating.selected" ng-change="ratingFilter(hotel, rating)" ng-init="ratingFilter(hotel, rating, 'init')"> 
     {{rating.name}} 
    </label> 


$scope.ratings = [ 
    { name:'One Star', value:1, selected: true}, 
    { name:'Two Stars', value:2, selected: true}, 
    { name:'Three Stars', value:3, selected: true}, 
    { name:'Four Stars', value:4, selected: true}, 
    { name:'Five Stars', value:5, selected: true} 
] 



     <div ng-repeat="hotel in (filteredHotels = (hotelResults | filter: resortFilter | filter: bbFilter | filter: priceFilter | filter: ratingFilter)) | startFrom:(currentPage - 1)*10 | limitTo:10 " class="hotel-results-container">

我需要一個ratingFilter功能，這樣的事情：

$scope.ratingFilter = function (hotel, rating, init) { 

    return (hotel.Rating >= $scope.hotelResults.Rating); 
}

這不工作，雖然。

我創建了一個priceFilter功能和工作原理：

$scope.priceFilter = function (hotel) { 
    return (hotel.Price > $scope.hotelResults.minPrice && hotel.Price < $scope.hotelResults.maxPrice); 
}

誰能幫我篩選通過評價的結果？

來源

2014-12-04 user1532669

您可以同時使用'hotelResults'作爲collection（ng-repeat）和object（'scope.hotelResults.minPrice'）。它是什麼？ – mrak 2014-12-04 12:26:51

也許這是問題的一部分。看起來這些數據結構基本相同。我想要做的就是如果複選框被選中，則返回其中具有複選框值的數據。我今天嘗試了很多東西，我可能不完全理解這一點來解決它。對不起，我迷路了:( – user1532669 2014-12-04 17:47:10

這可能有所幫助：http://jsfiddle.net/ExpertSystem/wYfs4/3/ – user1532669 2014-12-04 22:35:40

我得到這個通過重寫priceFilter和ratingFilter功能來分類，使他們現在這個樣子：

.filter('rangeFilter', function() { 
    return function(hotelResults, price) { 

    var filtered = []; 
    var priceMin = parseInt(price.min); 
    var priceMax = parseInt(price.max); 

    angular.forEach(hotelResults, function(hotel) { 
     if((hotel.Price >= priceMin && hotel.Price <= priceMax)) { 
     filtered.push(hotel); 
     } 
    }); 

    return filtered; 
    }; 
}) 


.filter('ratingsFilter', function() { 
    return function(hotelResults, ratings) { 
    filteredResults = [] 
    angular.forEach(hotelResults, function(hotel) { 
     angular.forEach(ratings, function(rating) { 
     if (hotel.Rating === rating.value && rating.selected === true) { 
      filteredResults.push(hotel) 
     } 
     }) 
    }) 
    return filteredResults; 
    } 
})

等級HTML如下：

<div class="filter--hotel__container quarter"> 
    <label ng-repeat="rating in ratings"> 
    <input name="rating" type="checkbox" ng-model="rating.selected" ng-checked="rating.selected"> {{rating.name}} 
    </label> 
</div>

滑塊HTML定價看起來是這樣的：

<!-- Price range slider --> 
<div data-range-slider data-min="hotelResults.minPrice" data-max="hotelResults.maxPrice" data-model-min="price.min" data-model-max="price.max" data-show-values="false"></div> 

<!-- Minimum price --> 
<div class="hotel-search__price-min"> 
    <span data-ng-bind="price.min|currency:'£'"></span> 
</div> 

<!-- Current selected price --> 
<div class="hotel-search__price-max"> 
    <span data-ng-bind="price.max|currency:'£'"></span> 
</div>

ng-repeat代碼如下所示：

<div ng-repeat="hotel in (filteredHotels = (hotelResults | filter: searchFilter | filter: resortFilter | filter: bbFilter | rangeFilter:price | ratingsFilter:ratings)) | startFrom:(currentPage - 1)*10 | limitTo:10 " class="hotel-results-container">

來源

2014-12-08 17:02:03 user1532669

創建角度過濾器功能的問題

回答

相關問題