Javascript ng显示在ng重复中使用多个过滤器

我有一个包含多个过滤器的ng repeat列表，但由于我需要隐藏元素，而不是从DOM中删除元素，所以我使用ng show进行过滤

这是我的第一个过滤器的外观：

<a href="" ng-click="myFilter = ''; toggle = toggle=0; togglesec=0; mySecondFilter = {}" ng-class="{'active' : toggle==0}" >
   Tot
</a>

<a href="" ng-click="myFilter = 'pa'; toggle = toggle=1;  togglesec=0;  mySecondFilter = {}" ng-class="{'active' : toggle==1}">
   Pa
</a>

<a href="" ng-click="myFilter = 'Reposteria'; toggle = toggle=2; togglesec=0; mySecondFilter = {}" ng-class="{'active' : toggle==2}">
   Reposteria
</a>

关于如何在同一个ng秀中组合两个过滤器，有什么建议吗

编辑 我已经应用了Naren的答案，但单击任何过滤器时都会出现以下错误：

angular.min.js:122 TypeError: Cannot create property 'vegan' on string ''.

我还尝试通过添加此项来初始化myFilter，但没有成功，出现了相同的错误：

$scope.myFilter = {
  tipus : '',
  vegan : '',
  gluten : '',
  lactosa : ''
};

---

更新：

因为用户需要用于筛选的通用版本。下面的函数应该是答案

$scope.validate = function(row) {
    for (var key in $scope.myFilter) {
      if ($filter('filter')([row], {
          [key]: $scope.myFilter[key]
        }).length === 0) {
        return false;
      }
    }
    return true;
  }

在这里，我们通过一个存储了所有过滤器的对象进行循环，如果有任何过滤器不满足，则返回false

请查看下面的示例以了解过滤器的工作原理

旧版：

这是我的修复版本。Angular的

$filter

非常适合用属性标识对象，但这不可能用HTML编写，因此我调用了一个函数，该函数将向

ng show

返回true或false

  $scope.validate = function(row) {
    if (row.tipus.indexOf($scope.myFilter) != -1) {
      if ($filter('filter')([row], $scope.mySecondFilter).length !== 0) {
        return true;
      } else {
        return false;
      }
    } else {
      return false;
    }
  }

让我解释一下功能。首先，我们通过validate参数接收

ng repeat

行，然后我应用第一个

if

条件，这基本上是您之前编写的条件，顺便说一句，这段代码工作得很好。然后，我使用

$scope.mySecondFilter

中存在的对象的

$filter

语法检查行，有关使用

$filter

进行筛选的详细信息，这将基本上检查传递的行是否包含所需的对象属性，并返回

true

或

false

下面是一个代码的工作示例，供参考

---

请让我知道这是否完全解决了您的问题：）

有效！我怎样才能包括第三个过滤器或第四个过滤器，如第二个过滤器？@EricMitjans请提及您希望在问题中找到通用解决方案！我更新了我的答案，请将此代码用作模板并构建您的应用程序。@EricMitjans此通用解决方案是否完全解决了您的问题？如果您遇到任何问题，请告诉我。@Ericmitjan如果代码正常，请告诉我何时可以进行JSFIDLE协作，您可以向我显示错误！

$scope.myFilter = {
  tipus : '',
  vegan : '',
  gluten : '',
  lactosa : ''
};

$scope.validate = function(row) {
    for (var key in $scope.myFilter) {
      if ($filter('filter')([row], {
          [key]: $scope.myFilter[key]
        }).length === 0) {
        return false;
      }
    }
    return true;
  }

  $scope.validate = function(row) {
    if (row.tipus.indexOf($scope.myFilter) != -1) {
      if ($filter('filter')([row], $scope.mySecondFilter).length !== 0) {
        return true;
      } else {
        return false;
      }
    } else {
      return false;
    }
  }