Question

我在ngRepeat中有一个ngRepeat，我想过滤两者。
过滤器应匹配文件夹名称或表单名称，此时过滤器正在运行，但它正在检查所有属性我希望过滤器只检查＆＃34; Name＆＃34;文件夹和表单的属性。

这是一个plunker：plnkr.co/edit/Y5HXbtAB3S7KxGqchQZm?p=preview

Answer 1

首先，我建议将文件夹“Name”属性更改为“folderName”，以防止与表单“Name”属性混淆。

如果我理解正确，您希望文件夹在2种情况下显示：

其中一个表单名称与搜索匹配。
文件夹名称本身与搜索匹配（同时显示所有子项）。

更新：

对于你想要的东西，我更喜欢使用自定义函数来操纵显示的数组而不是使用过滤器，请查看此代码。

// Code goes here
var app = angular.module("app",[]);

app.controller("ctrl",function($scope){

  var folder = [
  {
    "DisplayName_MO": "Templates",
    "Key": 555974658,
    "folderName": "Templates",
    "forms": [
      {
        "Key": 751017984,
        "Revision": 2,
        "Name": "form1"
      },
      {
        "Key": 751017985,
        "Revision": 2,
        "Name": "form2"
      }
    ]
  },
  {
    "DisplayName_MO": "Archive",
    "Key": 555974659,
    "folderName": "Archive",
    "forms": [
      {
        "Key": 751017986,
        "Revision": 2,
        "Name": "trex"
      }
    ]
  },
  {
    "DisplayName_MO": "Inbox",
    "Key": 555974660,
    "folderName": "Inbox",
    "forms": [
      {
        "Key": 751017987,
        "Revision": 2,
        "Name": "View"
      }
    ]
  },
  {
    "DisplayName_MO": "Outbox",
    "Key": 555974661,
    "folderName": "Outbox",
    "forms": [
      {
        "Key": 751017988,
        "Revision": 2,
        "Name": "Star"
      }
    ]
  }
]

  $scope.updateFilteredArray = function(){
  var tempArray = JSON.parse(JSON.stringify(folder)), //create a deep copy of the originl array
    searchTerm = $scope.searchText;
    if(searchTerm){
    searchTerm = searchTerm.toLowerCase();
       for(var i = 0; i < tempArray.length; i++){
        if(tempArray[i].folderName.toLowerCase().indexOf(searchTerm) == -1){
          var formsArray = tempArray[i].forms;
          for(var y = 0; y < formsArray.length; y++){
            if(formsArray[y].Name.toLowerCase().indexOf(searchTerm) == -1){
              formsArray.splice(y, 1);
              y--;
            }
          }
          if(formsArray.length == 0){
            tempArray.splice(i, 1);
            i--;
          }
        }
       }
    }
    $scope.filteredArray = tempArray;
  }

  $scope.filteredArray = folder;
  
})

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@1.6.2" data-semver="1.6.2" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="app">
    <div ng-controller="ctrl">
      
      <input ng-model="searchText" ng-change="updateFilteredArray()"/>
      
      <ul>
        <li ng-repeat="x in filteredArray">
          {{x.folderName}}
          <ul><li ng-repeat="y in x.forms">{{y.Name}}</li></ul>
          
        </li>
      </ul>
    </div>
  </body>

</html>

Anugularjs过滤2级重复

1 个答案: