NGリピートフィルタおよび2つの値

これは私のJSONデータである：あなたが見ることができるように、私は「名前」と「家族を各行の2キーを持っているNGリピートフィルタおよび2つの値

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

。これはJSONオブジェクトで「検索」私のNGリピートフィルタリングである：

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

、これらはfilteriのための私の入力であり、 NG：

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">

私は名前は "ELIN" と "サラ" である行を必要としています。私は "AND条件"を探しています。どうやってやるの？

出典

2016-12-31 kamalon

サンプル入力と出力 – Sajeetharan

入力： "eiln"と "sara" - 出力： "elin"と "sara"という名前の第1行目と第3行目を表示します。 – kamalon

あなたは私の答えをチェックしましたか？ –

最初に、いいえ、あなたはAND条件ではなく、OR条件を探しています。実際、家族は同時に「エリン」と「サラ」という名前を付けることはできません。

filterフィルタのドキュメントを読むと、関数が引数として受け入れられ、値が受け入れられると真理値を返し、拒否された場合は真理値を返さなければならないことがわかります。だから、あなたが必要とするすべてはあなたがカスタムのフィルタOR条件を使用する必要が

ng-repeat="member in familyMember| filter:isAccepted">

と

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

出典

2016-12-31 13:37:19

です。

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

DEMO

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="[email protected]" 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>

出典

2016-12-31 13:46:18 Sajeetharan

それはうまくいきません!! – kamalon

それが動作し、名前を入力して – Sajeetharan

を参照してくださいありがとうございました – kamalon

この作業のデモ試してみてください：

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>

を

出典

2016-12-31 21:13:23

NGリピートフィルタおよび2つの値

答えて

関連する問題