我有這裏的代碼,允許我按類別($ scope.myFilter)過濾我的產品。這工作正常,但我也想增加功能來按公司過濾產品,但似乎我沒有一點幫助就無法做到。按類別和公司使用AngularJS篩選功能
app.controller('AdminController_Music', function ($scope, $filter) {
var myStore = new store();
$scope.currentPage = 0;
$scope.pageSize = 12;
$scope.numberOfPages = Math.ceil(myStore.products_sound.length/$scope.pageSize);
$scope.filteredItems = [];
$scope.groupedItems = [];
$scope.pagedItems = [];
var searchMatch = function (haystack, needle) {
if (!needle) {
return true;
}
return haystack.toLowerCase().indexOf(needle.toLowerCase()) !== -1;
};
$scope.search = function (name) {
$scope.filteredItems = $filter('filter')(myStore.products_sound, function (product) {
for (var attr in product) {
if (searchMatch(product[name], $scope.query))
return true;
}
return false;
});
$scope.currentPage = 0;
$scope.groupToPages();
};
$scope.myFilter = function (column, category) {
$scope.filteredItems = $filter('filter')(myStore.products_sound, function (product) {
for (var attr in product) {
if (searchMatch(product[column], category))
return true;
}
return false;
});
$scope.currentPage = 0;
$scope.groupToPages();
};
$scope.groupToPages = function() {
$scope.pagedItems = [];
for (var i = 0; i < $scope.filteredItems.length; i++) {
if (i % $scope.pageSize === 0) {
$scope.pagedItems[Math.floor(i/$scope.pageSize)] = [$scope.filteredItems[i]];
} else {
$scope.pagedItems[Math.floor(i/$scope.pageSize)].push($scope.filteredItems[i]);
}
}
};
// functions have been describe process the data for display
$scope.myFilter();
$scope.search();
});
我試着玩myFilter函數,但效果不好。
this.products_sound = [
{ num: 1, code: '001s', category: 'toy', company:'lego', name: 'lego1', src: "product/1.jpg", description: 'Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. ', price: 69.99, class: 'show-down' },
這是HTML。第二個工程和第一個不...
<ul class="filter group albumFilter">
<p>Brands:</p>
<li ng-click="myFilter('company','lego'" >Lego</li>
<li ng-click="myFilter('category','construction')" >Construct</li>
</ul>
這是生產版本的代碼。它在Cyrillic,所以不要打擾文字。只需導航到產品循環;排序按鈕是最重要的是:
http://konstantindichev.com/flexfit/
嗨,謝謝我明天早上會試試這個,並檢查這個答案爲接受:) – user1780729