Javascript 角度动态从ng repeat中移除过滤器

我有一个类似这样的重复：

<div ng-repeat="user in staff | profAndDr">

我需要添加一个复选框，如果选中该复选框，将显示具有Amaritos教授头衔的人员。所以，基本上我需要删除我的过滤器从ng重复如果检查

链接到

谢谢

您可以在不使用筛选器的情况下编写附加的ng repeat，但这是一种不好的做法。我建议您将真/假标志传递给应该按原样返回输入的过滤器

HTML

---

您可以将变量传递到过滤器中，然后使用它来确定是否选中了复选框

e、 g

---

您可以将复选框的值作为参数传递给过滤器。如果您想显示所有内容，只需返回原始输入即可

app.filter('profAndDr', function() {
  return function(input, showAmaritos) {
    if (showAmaritos) {
      return input;
    }
    var out = [];
    angular.forEach(input, function(title) {
        if (title.title === 'PROF.'||title.title==='DR.') {
            out.push(title)
        }
    });
    return out;
  }
}

HTML

参见更新的js

var phonecatApp = angular.module('staffApp', []);

"use strict";

 phonecatApp.controller('StaffListCtrl', ['$scope', '$filter', function         ($scope) {
 $scope.title=false;
 $scope.staff = [
{
  "first": "POZIK",
      "last": "GOLDSMITH",
      "title": "PROF."
},
{
  "first": "LOSHOK",
      "last": "GALIMIY",
      "title": "DR."
},
{
  "first": "SHMOK",
      "last": "GOLDSMITH",
      "title": "PROF. AMARITOS"
},

] }]

phonecatApp.filter('profAndDr', function() {
return function(input,test) {
    var out = [];
    angular.forEach(input, function(title) {
    if(test == false){
        if (title.title === 'PROF.'||title.title==='DR.') {
            out.push(title)
        }

    }
     else if(test == true){
        if (title.title === 'PROF. AMARITOS') {
            out.push(title)
        }
      }
    })
return out;
}

})

在你的html中

<input id="amaritos" type="checkbox" ng-model='title'>

---

您可以通过在ng模型属性中为输入分配变量来截取输入值。然后，您可以将条件添加到过滤器中，以根据输入值执行不同的操作

希望这有帮助

app.filter('profAndDr', function() {
    return function(input, isChecked) {
        var out = [];
        angular.forEach(input, function(title) {
            if (title.title === 'PROF.' || title.title==='DR.' || (isChecked && [othercondition])) {
                out.push(title)
            }
        })
    return out;
}

app.filter('profAndDr', function() {
  return function(input, showAmaritos) {
    if (showAmaritos) {
      return input;
    }
    var out = [];
    angular.forEach(input, function(title) {
        if (title.title === 'PROF.'||title.title==='DR.') {
            out.push(title)
        }
    });
    return out;
  }
}

<input id="amaritos" ng-model="showAmaritos" type="checkbox">

<div ng-repeat="user in staff | profAndDr:showAmaritos">

var phonecatApp = angular.module('staffApp', []);

"use strict";

 phonecatApp.controller('StaffListCtrl', ['$scope', '$filter', function         ($scope) {
 $scope.title=false;
 $scope.staff = [
{
  "first": "POZIK",
      "last": "GOLDSMITH",
      "title": "PROF."
},
{
  "first": "LOSHOK",
      "last": "GALIMIY",
      "title": "DR."
},
{
  "first": "SHMOK",
      "last": "GOLDSMITH",
      "title": "PROF. AMARITOS"
},

phonecatApp.filter('profAndDr', function() {
return function(input,test) {
    var out = [];
    angular.forEach(input, function(title) {
    if(test == false){
        if (title.title === 'PROF.'||title.title==='DR.') {
            out.push(title)
        }

    }
     else if(test == true){
        if (title.title === 'PROF. AMARITOS') {
            out.push(title)
        }
      }
    })
return out;
}

<input id="amaritos" type="checkbox" ng-model='title'>