Динамически установить фильтр в angularjs

Question

Я хочу отфильтровать таблицу в соответствии с критериями, выбранными в раскрывающемся списке. Запись val в функции newList не фильтрует таблицу. Любые предложения, как пройти через это.

• HTML

  <tbody> 
  
      <tr ng-repeat="friendObj in newfriends"> 
  
      <td>{{friendObj.name}}</td> 
  
      <td>{{friendObj.phone}}</td> 
  
      <td>{{friendObj.age}}</td> 
      </tr> 
  
  </tbody> 
  

  • JS

    $scope.newList = function (val) { 
         alert(val); 
    $scope.newfriends = $filter('filter')($scope.friends, { 
        val: $scope.searcha 
    }) 
    

Answer 1

В соответствии с вашим кодом, вы пытаетесь добавить критерии несколько раз, то вы хотите отфильтровать с этими критериями.

Здесь, в вашем JSON, всего 3 объекта. {имя, телефон и возраст}.

Таким образом, ваши критерии не должны превышать 3 ряда, и он не должен иметь одну и ту же вещь дважды. Если вы это сделаете, вам нужно создать собственный фильтр. Используйте следующий код

$scope.newList = function() { 
    var searchBy = {}; 
    angular.forEach($scope.newCriteria, function(criteria, key) { 
    searchBy[criteria.name] = criteria.value; 
    }); 
    $scope.newfriends = $filter('filter')($scope.friends, searchBy); 
} 

И Html следующим

<div id="searchy"> 

<ul class="list-unstyled"> 
    <li style="display: inline-block" ng-repeat="crtia in newCriteria"> 
    <table> 
     <tr> 

     <td> 
      <select ng-model="crtia.name" ng-options="searchopt for searchopt in searchcriteria " ng-click="searchy.check()"></select> 
     </td> 
     <td> 
      <input ng-model="crtia.value" placeholder="{{crtia.name}}" ng-change="newList()" /> 
     </td> 

     </tr> 
    </table> 
    </li> 
</ul> <button ng-click="searchy.generate()">Add Criteria</button> </div> 

Вот обновленный plunker. http://plnkr.co/edit/r5OcI366dyvLQ24fFIje?p=preview.

Answer 2

Возможно, вы хотите, чтобы фильтровать на основе выбора ниспадающего, а затем создать правильную модель поиска, как

<select ng-model="selectedsearchcriteria" 
     ng-options="searchopt for searchopt in searchcriteria "></select> 

<!--When you select dropdown 'selectedsearchcriteria' update like 'name', 'age' and so on 
then ng-model="search[selectedsearchcriteria]" forms like search.name, search.age and so on--> 
<input name="search" ng-model="search[selectedsearchcriteria]" placeholder="{{selectedsearchcriteria}}" /> 

<!--Here 'filter:search:strict' filter like search.name it is like property based filter--> 

<tr ng-repeat="friendObj in newfriends |filter:search:strict"> 

Также я думаю, что вам не нужно использовать $filter('filter') в контроллере

Проверить update plunker