Question

我这里有这个代码，允许我按类别（$ scope.myFilter）过滤我的产品。这很好，但我想添加功能来按公司过滤产品，但似乎没有一点帮助我就做不到。

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/

Answer 1

您的过滤器看起来无法正常工作。它可以更轻松地完成：

$scope.myFilter = function(key, value) {
    var search = {};
    search[key] = value;

    $scope.filteredItems = $filter('filter')(myStore.products_sound, search);
    $scope.currentPage = 0;
    $scope.groupToPages();
};

您可以按对象过滤商品（例如$filter('filter')(myStore.products_sound,{company: "lego"});

您可以在此处查看一些示例：http://voryx.net/using-angularjs-filter-inside-the-controller/

Answer 2

我实际上通过改变查找已排序项目的方式来修复我的功能以正常工作。

    $scope.myFilter = function (attribute, string) {
    $scope.filteredItems = $filter('filter')(myStore.products_sound, function (product) {
        for (var attr in product) {
            if (searchMatch(product[attribute], string))
                return true;
        }
        return false;
    });
    $scope.currentPage = 0;
    $scope.groupToPages();
    };

使用AngularJS按类别和公司过滤功能

2 个答案: