AngularJs 드롭 다운 필터로 검색

Question

어떻게하면 세련된 검색을 만들까요? 아래 코드를 사용하면 필터가 두 열 모두에서 작동합니다. 예를 들어, John을 입력하면 John Smith & Smith John을 모두 받게됩니다. 에 의해 필터로 드롭 다운을 사용하고 싶습니다. 나는 filter : object.value 또는 뭔가 언급 한 다른 게시물을 보았다.

드롭 다운을 텍스트 상자에 입력 된 값으로 설정하고 표로 필터링해야한다고 생각합니다.

<div ng-app="searchApp" ng-controller="searchCtrl"> 
    <br> 
    <br> 
    <input type="text" ng-model="searchData"> 

    <table> 
     <thead> 
      <tr> 
       <th>First Name</th> 
       <th>Last Name</th> 
      </tr> 
     </thead> 
     <tbody> 


      <select> 
       <option value="">FilterBy</option> 
       <option value="">FirstName</option> 
       <option value="">LastName</option> 
      </select> 



      <tr ng-repeat="name in names | filter:searchData"> 

       <td>{{name.firstName}}</td> 
       <td>{{name.lastName}}</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

<script src=" search.js " type="text/javascript "></script> 

의 .js

var searchApp = angular.module('searchApp', []); 
searchApp.controller('searchCtrl', function($scope) { 

$scope.names = [ 
     {"firstName":"John","lastName":"Smith"}, 
     {"firstName":"Smith","lastName":"John"}, 
     {"firstName":"John","lastName":"Doe"}, 
     {"firstName":"Doe","lastName":"Jane"} 
     ]; 



}); 

Answer 1

HTML은 I 필터에 NG 변화가 떨어질 그 함수 호출에 필터 객체를 설정했다. 여기

<select ng-model="by" ng-change="filter(by)"> 
<option value="">FilterBy</option> 
<option value="firstName">FirstName</option> 
<option value="lastName">LastName</option> 
</select> 


$scope.filter = function(by){ 
    if(by){ 
    $scope.filterData = { }; 
    $scope.filterData[by] = $scope.searchData; 
    }else{ 
    $scope.filterData = {}; 
    } 
}; 

가 동작하는 예제이 유사 http://codepen.io/mkl/pen/GqpxGZ