Angular-如何显示结果，仅在未选中时显示

Angular - How to make results show, only if unchecked

本文关键字：显示 结果 何显示 Angular-      更新时间：2024-05-03

我有一段代码可以过滤并显示复选框的结果。如果取消选中所有复选框，则显示所有结果；如果选中复选框，仅显示选定的复选框。

然而，当复选框未选中时，我试图显示所有结果，如果复选框被选中，则它不会显示特定结果，同时继续显示未选中的框。

控制器.js

function AdvisorListCtrl( $location, $scope, db) {
    $scope.orderProp = 'number';
    $scope.courseCheckboxes = {};
    $scope.teacherCheckboxes = {};
    $scope.courses = db.courses.query({order:$scope.orderProp, name:$scope.query});
    function getChecked(obj){
        var checked = [];
        for(var key in obj)
            if(obj[key]) checked.push(key);
        return checked;
    }
    $scope.searchFilter = function(row){
        var courChecked = getChecked($scope.courseCheckboxes);
        var teachChecked = getChecked($scope.teacherCheckboxes);
        if (courChecked.length == 0 && teachChecked.length == 0)
            return true;
        else {
            if ($scope.courseCheckboxes[row.name])
                return true;
            else {
                return row.teacher.split(/,'s*/).some(function(teach){
                    return $scope.teacherCheckboxes[teach];
                });
            }
        }
    }
}

html

<li><b><h2>Filter by Class</h2></b></li>
<li ng-repeat="course in courses | orderBy:['-status', 'name']">
    <label>
        <input type="checkbox" ng-model="courseCheckboxes[course.name]" />{{course.name}}
    </label>
</li>

我误解了你的问题，所以我重新编辑了答案。

当searchFilter（record）返回false时，记录将被过滤掉（不显示）。

这是一个过滤器的版本，它应该做与正在做的相反的事情（隐藏被检查的商家和包含被检查品牌的商家）。希望这能有所帮助。

html

<div ng-repeat="record in records | filter: searchFilter">
{{record.Description}}

js

$scope.searchFilter = function(row){
  var mercChecked = getChecked($scope.merchantCheckboxes);
  var brandChecked = getChecked($scope.brandCheckboxes);
  if(mercChecked.length == 0 && brandChecked.length == 0)
    return true;
  else{
    if($scope.merchantCheckboxes[row.MerchantName]){
      return false;  // <----------------- changed here true to false
    } else {
      // changed here adding ! 
      return !row.BrandList.split(/,'s*/).some(function(brand){
        return $scope.brandCheckboxes[brand];
      });
    }
  }
};
相关文章：