Chức năng lọc tùy chỉnh AngularJS

Bên trong bộ điều khiển của tôi, tôi muốn lọc một mảng các đối tượng. Mỗi đối tượng này là một bản đồ có thể chứa các chuỗi cũng như danh sách

Tôi đã thử sử dụng $filter('filter')(array, function)định dạng nhưng tôi không biết cách truy cập các phần tử riêng lẻ của mảng bên trong hàm của mình. Đây là một đoạn mã để hiển thị những gì tôi muốn.

$filter('filter')(array, function() {
  return criteriaMatch(item, criteria);
});

Và sau đó criteriaMatch(), tôi sẽ kiểm tra xem từng thuộc tính riêng lẻ có khớp với

var criteriaMatch = function(item, criteria) {
  // go thro each individual property in the item and criteria
  // and check if they are equal
}

Tôi phải làm tất cả những điều này trong bộ điều khiển và biên dịch danh sách các danh sách và đặt chúng trong phạm vi. Vì vậy, tôi chỉ cần truy cập $filter('filter')theo cách này. Tất cả các ví dụ tôi tìm thấy trong mạng cho đến nay đều có tìm kiếm tiêu chí tĩnh bên trong hàm, chúng không chuyển đối tượng tiêu chí và kiểm tra đối với từng mục trong mảng.

Bạn có thể sử dụng nó như sau: http://plnkr.co/edit/vtNjEgmpItqxX5fdwtPi?p=preview

Giống như bạn đã tìm thấy, filterhàm chấp nhận vị từ chấp nhận từng mục từ mảng. Vì vậy, bạn chỉ cần tạo một hàm vị từ dựa trên giá trị đã cho criteria.

Trong ví dụ này, criteriaMatchlà một hàm trả về một hàm vị từ khớp với giá trị đã cho criteria.

bản mẫu:

<div ng-repeat="item in items | filter:criteriaMatch(criteria)">
  {{ item }}
</div>

phạm vi:

$scope.criteriaMatch = function( criteria ) {
  return function( item ) {
    return item.name === criteria.name;
  };
};

Đây là ví dụ về cách bạn sử dụng filtertrong AngularJS JavaScript của mình (thay vì trong phần tử HTML).

Trong ví dụ này, chúng ta có một mảng các bản ghi Quốc gia, mỗi bản ghi chứa một tên và một mã ISO 3 ký tự.

Chúng tôi muốn viết một hàm sẽ tìm kiếm một bản ghi trong danh sách này khớp với một mã 3 ký tự cụ thể.

Đây là cách chúng tôi sẽ làm điều đó mà không cần sử dụng filter:

$scope.FindCountryByCode = function (CountryCode) {
    //  Search through an array of Country records for one containing a particular 3-character country-code.
    //  Returns either a record, or NULL, if the country couldn't be found.
    for (var i = 0; i < $scope.CountryList.length; i++) {
        if ($scope.CountryList[i].IsoAlpha3 == CountryCode) {
            return $scope.CountryList[i];
        };
    };
    return null;
};

Yup, không có gì sai với điều đó.

Nhưng đây là cách hàm tương tự sẽ trông như thế nào, sử dụng filter:

$scope.FindCountryByCode = function (CountryCode) {
    //  Search through an array of Country records for one containing a particular 3-character country-code.
    //  Returns either a record, or NULL, if the country couldn't be found.

    var matches = $scope.CountryList.filter(function (el) { return el.IsoAlpha3 == CountryCode; })

    //  If 'filter' didn't find any matching records, its result will be an array of 0 records.
    if (matches.length == 0)
        return null;

    //  Otherwise, it should've found just one matching record
    return matches[0];
};

Gọn gàng hơn nhiều.

Nhớ lấy filter quả trả về một mảng (danh sách các bản ghi phù hợp), vì vậy trong ví dụ này, chúng ta sẽ muốn trả về 1 bản ghi hoặc NULL.

Hi vọng điêu nay co ich.

Ngoài ra, nếu bạn muốn sử dụng bộ lọc trong bộ điều khiển của mình giống như cách bạn làm ở đây:

<div ng-repeat="item in items | filter:criteriaMatch(criteria)">
  {{ item }}
</div>

Bạn có thể làm điều gì đó như:

var filteredItems =  $scope.$eval('items | filter:filter:criteriaMatch(criteria)');