Question

我尝试使用Angular过滤记录集，但我遇到了问题。

var licenseKeys = [
    {"product" : "XBox360", "inventoryProduct" : "XBox", "serialNumber" : "101", "status" : "Active", "actionBy" : "gamer1", "licenseKey" : "XB2-c40100697d-40b5bc3", "expiry" : "No Expiration"},
    {"product" : "XBox360", "inventoryProduct" : "XBox", "serialNumber" : "110", "status" : "Active", "actionBy" : "gamer2", "licenseKey" : "XB2-c4010697d-c9d7001", "expiry" : "No Expiration"},
    {"product" : "PS4", "inventoryProduct" : "Play Station", "serialNumber" : "111", "status" : "Active", "actionBy" : "gamer1", "licenseKey" : "PS4-c40100697d-c9d7081", "expiry" : "No Expiration"},
    {"product" : "PS3", "inventoryProduct" : "Play Station", "serialNumber" : "105", "status" : "InActive", "actionBy" : "gamer3", "licenseKey" : "PS3-c9d708000001", "expiry" : "No Expiration"},
    {"product" : "XBox One", "inventoryProduct" : "XBox", "serialNumber" : "109", "status" : "Active", "actionBy" : "gamer3", "licenseKey" : "XB3-40009b5bc3-c9d708000001", "expiry" : "No Expiration"},
    {"product" : "XBox", "inventoryProduct" : "XBox", "serialNumber" : "103", "status" : "Active", "actionBy" : "gamer1", "licenseKey" : "XB-c40100697d-c708d000001", "expiry" : "No Expiration"}
  ];

我在表格中显示记录集，并在表格标题下有过滤器下拉列表和文本框。我想在产品和状态列上精确匹配，因为选择XBox的产品会导致它返回XBox，Xbox360＆amp;使用标准时的XBox One包含搜索。

我已经设置了两个数组，用于保存过滤器的键值对，另一个用于保存我想要执行完全匹配的列。

var strictSearchFields = ["product", "status"]; var searchFilter = { product: "", inventoryProduct: "", serialNumber: "", status: "", actionBy: "", licenseKey: "", expiry: "" };

我已在app.js文件中设置自定义过滤器

app.filter('CustomListPageFilter', ['$filter', function($filter) { return function (input, searchFilters, strictSearchFields) { var filteredRecordset = []; angular.forEach(strictSearchFields, function (currentFilter) { if (searchFilters[currentFilter] !== "") { var test = currentFilter; filteredRecordset[currentFilter] = searchFilters[currentFilter] + " : true"; } }); return $filter('filter')(input, filteredRecordset); } }]);

我在我的HTML中调用它是这样的：

licenseKeys | CustomListPageFilter : searchFilter : strictSearchFields

问题在于它没有按预期运行，无论我选择哪种产品，我最终都没有返回。我读到添加：true你想要搜索的字段确实会绕过包含，但这似乎并没有起作用。

Answer 1

我相信内置过滤器应符合您的要求，您可以在过滤器中指定{field：query}对象，如下所示：

collection | filter:{'product': 'XBox'}:true

对于尽可能接近您提供的代码的示例，请参阅

http://plnkr.co/edit/lhwEKUNGOsLtDXjGAsu9?p=catalogue

我使用范围变量而非显式对象来控制搜索查询，并使用复选框来切换严格模式。＆＃39;

Answer 2

我实际上是使用自定义过滤器解决了这个问题。基本上它被称为这样，但是Plunker拥有所有代码。

<tr ng-repeat="license in filteredLicenseKeys = (licenseKeys |
orderBy:'status' | licenseKeyFilter : searchFilters :
strictSearchFields)">

http://plnkr.co/edit/1VV2ugw9rNcM1CKQaItW?p=preview

AngularJS自定义过滤器应用于记录集

2 个答案: