2017-05-10 6 views
3

角度フィルタでtitleというプロパティを無視しようとしています。角度フィルタでプロパティを無視する方法

const data = [ 
    { 
     title: 'Title 1' 
     groups: [ 
      {...}, 
      {...}, 
      {...} 
     ] 
    }, 
    { 
     title: 'Title 2' 
     groups: [ 
      {...}, 
      {...}, 
      {...} 
     ] 
    }, 
    { 
     title: 'Title 3' 
     groups: [ 
      {...}, 
      {...}, 
      {...} 
     ] 
    } 
]; 

と私はオブジェクトを反復処理するためのフィルタとngのリピートを使用していて、他のループのグループを反復処理するために:私は、以下の例のようなデータセットが持っている

<input ng-model="search"> 
<div ng-repeat="item in data | filter:search"> 
    <h1>{{item.title}}</h1> 
    <ul> 
     <li ng-repeat="group in item.group | filter:search"> 
      <span>{{group.something}}</span> 
     </li> 
    </ul> 
</div> 

はですうまくいきましたが、今は検索のタイトルを無視したいと思います。私はfilter:search:item.title(最初のng-repeat中)のようないくつか試してみたかったし、最初にfilter:searchを取り除いたが、すべての試行に失敗した。私は何が欠けているのですか?カスタム検索などが必要ですか?

ありがとうございます。上記のコードは、唯一の何かのプロパティに基づいてフィルタされます

<li ng-repeat="group in item.groups | filter: { something: search }"> 

+0

これを達成するために、これは助けることができるかもしれません:http://stackoverflow.com/questions/16563018/angularjs-custom-filters-and-ng-repeat –

答えて

1

あなたは、特にあなたがフィルタとタイトルを除外したいプロパティを入力することができます。

もっと答えとここでの説明:AngularJS filter only on certain objects

+1

私はグループ内のすべてを検索したいが、アイテムのタイトルではない。データ? –

0

あなたが入力した場合、タイトルプロパティをフィルタリングしていないが、ちょうど最初のフィルタを削除します。この方法で、あなたがタイプするときには、is notのマッチは隠れますが、彼らのh1は同じ場所にとどまります。あなたが考慮から(パラメータを無視する)は除外すべきプロパティを指定することができますカスタムフィルタを作成する必要があり

0

angular.module('app', []).controller('MyController', ['$scope', function($scope) { 
 
    $scope.data = [ 
 
     {name:"Tom", title:'London'}, 
 
     {name:"Max", title:'Moscow'}, 
 
     {name:"Henry", title:'NY'}, 
 
     {name:"Paul", title:'NY'}, 
 
     {name:"Sam", title:'Paris'} 
 
     ]; 
 
}]).filter('myfilter',function(){ 
 
    return function(input, search, ignore){ 
 
    if(!search) 
 
     return input; 
 
     
 
    var result = []; 
 
    
 
    for(var item of input) 
 
     for(var prop in item) 
 
     if(prop != ignore && item[prop].indexOf(search) != -1) 
 
     { 
 
      result.push(item) ; 
 
      break; 
 
     } 
 
     
 
    return result; 
 
    } 
 
});
<script src="//code.angularjs.org/snapshot/angular.min.js"></script> 
 

 
<body ng-app="app"> 
 
    <div ng-controller="MyController"> 
 
    search: <input type='text' ng-model='search' ng-init='search="a"'/> 
 
    ignore: <input type='text' ng-model='ignore' ng-init='ignore="title"'/> 
 
<ul> 
 
    <li ng-repeat='item in data | myfilter: search: ignore'> 
 
    {{item.name}} {{item.title}} 
 
    </li> 
 
</ul> 
 
</div> 
 
</body>
あなたがあなた自身の関数またはカスタムフィルタを記述する必要が

関連する問題