ng-повторите фильтр одним ключом и 2 значением

Это мои данные JSON:

[
 {
  "name": "elin",
  "family": "kinoian"
 },
 {
  "name": "simon",
  "family": "santos"
 },
 {
  "name": "sara",
  "family": "pinki"
 },
 {
  "name": "emin",
  "family": "richard"
 }
]

Как вы можете видеть, у меня есть 2 ключа в каждой строке » Имя » и «семья«.
Это моя фильтрация ng-repeat по объекту json » search«:

<li ng-repeat="membr in familyMember| filter:search">
  <span> {{membr.name}} - {{membr.family}}</span>
</li>

И это мои входные данные для фильтрации:

By name: <input type="text" ng-model="search.name1"> 
and <input type="text" ng-model="search.name2">

By family: <input type="text" ng-model="search.family">

Мне нужны строки, которые называются » Элин «и » Сара«. Я ищу «и условие» в фильтрации. Как я могу это сделать?

камалон, 31.12.2016 в 12:42 (источник)

3 ответа

Во-первых, нет, вы ищете не условие AND, а условие OR. Действительно, член семьи не может быть назван «Элин» и «Сара» одновременно.
Теперь, если Вы читаете документацию для filterфильтра, вы увидите, что он принимает функцию в качестве аргумента, который должен возвращать значение истинности, если значение принято, и значение истинности, если оно отклонено. Так что все, что вам нужно, это
```
ng-repeat="member in familyMember| filter:isAccepted">
```
и
```
$scope.isAccepted = function(member) {
    return member.name === $scope.search.name1 || member.name === $scope.search.name2;
}
```
JB Nizet,
31.12.2016 в 13:37

Необходимо использовать пользовательский фильтр с условием или.

 $scope.nameFilter = function(member) {
    var result = (member.name == $scope.membr.name1) ||
      (member.name == $scope.membr.name2) ||
      (member.family == $scope.membr.family);
    return result;
  };

ДЕМОНСТРАЦИЯ

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

myApp.controller("MyCtrl", ['$scope', function($scope) {
  $scope.familyMember = [{
    "name": "elin",
    "family": "kinoian"
  }, {
    "name": "simon",
    "family": "santos"
  }, {
    "name": "sara",
    "family": "pinki"
  }, {
    "name": "emin",
    "family": "richard"
  }];
  $scope.nameFilter = function(member) {
    var result = (member.name == $scope.membr.name1) ||
      (member.name == $scope.membr.name2) ||
      (member.family == $scope.membr.family);
    return result;
  };

}]);

<!DOCTYPE html>
<html>

<head>
  <script data-require="angular.js@1.4.7" data-semver="1.4.7" src="https://code.angularjs.org/1.4.7/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
  <div ng-app="myApp" ng-controller="MyCtrl">
    By name:
    <input type="text" ng-model="membr.name1" > and
    <input type="text" ng-model="membr.name2"> By family:
    <input type="text" ng-model="membr.family">
    <li ng-repeat="membr in familyMember| filter:nameFilter">
      <span> {{membr.name}} - {{membr.family}}</span>
    </li>
  </div>
</body>

</html>

Попробуйте эту рабочую демонстрацию :

var app = angular.module('myApp',[]);

app.controller('mainCtrl', function($scope) {   
  $scope.familyMember = [
 {
  "name": "elin",
  "family": "kinoian"
 },
 {
  "name": "simon",
  "family": "santos"
 },
 {
  "name": "sara",
  "family": "pinki"
 },
 {
  "name": "emin",
  "family": "richard"
 }
];

$scope.search = function(membr) {
  return membr.name === $scope.search.name1 || membr.name === $scope.search.name2;
}
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='myApp' ng-controller='mainCtrl'>
name1: <input type="text" ng-model="search.name1"> 
name2: <input type="text" ng-model="search.name2"><br><br>
    <li ng-repeat="membr in familyMember | filter:search">
        <span> {{membr.name}} - {{membr.family}}</span>
    </li>
</div>