AngularJS单选筛选不适用于Name、Description和Field4复选框值

AngularJS single select filtering is not working for Name, Description and Field4 checkbox values?

本文关键字：Description Field4 复选框 Name 单选 筛选 不适用 适用于 AngularJS      更新时间：2023-09-26

我有如下筛选：意味着，如果我选择multiple checkboxes（例如：从Name下拉列表中选择一个复选框，从Description下拉列表中选中一个复选复选框），那么这些相应的匹配数据在Name和Description列中都很好，其他选择也很好（如Description和Field4、Field4和名称dropdowns）。

如果我从所有下拉菜单中选择所有三个复选框（如name 1、description 1和field4 1），则匹配的数据在Name、Description和Field4列中都很好。

但我现在需要的是：数据不是通过单个复选框或单个复选框选择进行过滤的（例如：如果我选择任何Name、Description或field4下拉复选框，则所选复选框相关数据不会出现）。这样我就可以用三种情况过滤数据：单选、任意两个下拉复选框选择、所有三个下拉复选复选框选择。

下面给出了代码并创建了Fiddle。

我该怎么做？请帮我，提前谢谢。

我更新了更多的代码以使其正常工作。

$scope.filterItems = function(item) {
        if ($scope.pagedItems.name !== undefined && $scope.pagedItems.description !== undefined && $scope.pagedItems.name !== "false" && $scope.pagedItems.description !== "false") {
        if(item.name === $scope.pagedItems.name && item.description === $scope.pagedItems.description) return true;
    } else {
            if (item.name === $scope.pagedItems.name) return true;
        if (item.description === $scope.pagedItems.description) return true;
        if ((item.description.indexOf($scope.pagedItems.description) > -1 && 
             $scope.pagedItems.description !== '')) return true;
    }
    return false;
}

以及HTML:

<div>
    <div class="dropdown">
    <a href="#" data-toggle="dropdown" class="btn btn-default dropdown-toggle">Select Name<b class="caret"></b></a>
    <ul class="dropdown-menu">
        <li><input type="checkbox" data-ng-model='pagedItems.name' data-ng-true-value='name 1' data-ng-false-value='false' /> name1</li>
        <li><input type="checkbox" data-ng-model='pagedItems.name' data-ng-true-value='name 2' data-ng-false-value='false' /> name2</li>
        <li><input type="checkbox" data-ng-model='pagedItems.name' data-ng-true-value='name 3' data-ng-false-value='false' /> name3</li>
    </ul>
</div><br><br>
<div class="dropdown">
    <a href="#" data-toggle="dropdown" class="btn btn-default dropdown-toggle">Select Description <b class="caret"></b></a>
    <ul class="dropdown-menu">
        <li><input type="checkbox" data-ng-model='pagedItems.description' data-ng-true-value='description 1' data-ng-false-value='false' /> description 1</li>
        <li><input type="checkbox" data-ng-model='pagedItems.description' data-ng-true-value='description 2' data-ng-false-value='false' /> description 2</li>
    </ul>
</div>
</div>

通过将nameOne更改为name（与描述相同），我能够简化if语句，并使组合匹配在没有巨大if语句的情况下工作。

我更新了你的小提琴，你可以在这里找到

相关文章：