angularjs: change filter options dynamically

Question

What I want is something like this example in the documentation but with a unique input that can play the three roles of filtering by \"any\", \"name\" or \"phone\" properti

Answer 1

Here's one approach - there are probably others.

  

      

      


      Filter  by {{filter}}         

      

      
Any
      
By Name
      
By phone
      

      

      

      

        
Name
Phone
        

          
{{friend.name}}
          
{{friend.phone}}
        
      
  

Javascript:

function MainCtrl($scope, $http) {
    $scope.friends = [{name:'John', phone:'555-1276'},
                      {name:'Mary', phone:'800-BIG-MARY'},
                      {name:'Mike', phone:'555-4321'},
                      {name:'Adam', phone:'555-5678'},
                      {name:'Julie', phone:'555-8765'}];
    $scope.filter = "$";
    $scope.multi = "";
    $scope.changeFilterTo = function(pr) {
        $scope.filter = pr; 
    }
    $scope.getFilter = function() {
        switch ($scope.filter) {
            case 'name':
                return {name: $scope.multi};
            case 'phone':
                return {phone: $scope.multi};
            default:
                return {$: $scope.multi}
        }
    }
};