2016-06-08 4 views
0

이 검색 결과는 example과 비슷한 경우 검색 바를 ionic으로 만들려고합니다. ionic에 여러 키워드가있는 필터 목록

은 app.html입니다

<ion-content class="has-header" padding="true" ng-controller="appCtrl"> 
//Search Bar 
<label class="item item-input"> 
    <i class="icon ion-search placeholder-icon"></i> 
    <input type="search" placeholder="Search" ng-model="searchText"> 
</label> 

//This is the list that we want to search 
<form style="" class="list"> 
    <ion-list> 
     <ion-item ng-repeat="item in items | filter: userFilter() "> 
     <div class="row responsive-sm"> 
      <div class="col"> 
      <div>Item Id {{item.id}}</div> 
      <div>Item detail{{item.detail}}</div> 
      <div>Date{{item.date}}</div> 
      </div> 
     </div> 
     </ion-item> 
    </ion-list> 
    </form> 
</ion-content> 

코드가,이 항목을 더 사 우리가 쓸에는 2 항목을 표시하지 가정 작동하는지 이것은 controller.js

.controller('appCtrl', function($scope,$state,$location,$ionicModal,$filter) { 
$scope.items = [    
          { 
           id  : 1 , 
           detail : "A book about ghost", 
           date  : "20 March 1999" 
          }, 
          { 
           id  : 2, 
           detail : "A Book about famous person", 
           date  : "20 March 1999" 
          }, 
          { 
           id  : 3, 
           detail : "A Map to a house", 
           date  : "20 March 1999" 
          }, 
          { 
           id  : 4, 
           detail : "A famous horror Novel", 
           date  : "20 March 1999" 
          }, 
          { 
           id  : 5, 
           detail : "A story about the haunted house", 
           date  : "20 March 1999" 

          }]; 
//The filter that is used 
$scope.userFilter = function(item) { 
    // default to no match 
    var isMatch = false; 

    if ($scope.searchText) { 
    // split the input by space 
    var parts = $scope.searchText.split(' '); 

    // iterate each of the words that was entered 
    parts.forEach(function(part) { 
     // if the word is found in the post, a set the flag to return it. 
     if (new RegExp('part').test(item)) { 
     isMatch = true; 
     } 
    }); 
    } else { 
    // if nothing is entered, return all posts 
    isMatch = true; 
    } 

    return isMatch;};}) 

입니다 "유명한". 대신 필터를 사용하면 목록의 모든 항목이 사라집니다. 어쨌든 해결할 수 있습니까?

답변

0

ng-repeat 필터에서 함수를 호출 한 것 같습니다. 매개 변수없이 userFilter()를 호출하고 항목 매개 변수가있는 함수가 문제가 아닌지 확인하십시오 plunkr에 시도해 볼 수있는 예 링크가 없습니다.

행운

+0

이 링크 http://plnkr.co/edit/d17dZDrlhY2KIfWCbKyZ?p=preview입니다. 나는 항목 매개 변수가 항목의 ng-repeat 항목에있는 매개 변수라고 생각합니다. – LearningDummy