title: How to filter a list in AngularJS using several links
body: <p>I have been going over a lot of tutorials on how to filter a list and can't find an example for my simple use-case.</p>
  
  <p>I have several buttons such as</p>
  
  <pre><code>&lt;a href="#" id="filter-by-name"&gt;Name&lt;/a&gt;
  &lt;a href="#" id="filter-by-age"&gt;Age&lt;/a&gt;
  &lt;a href="#" id="filter-by-height"&gt;Height&lt;/a&gt;
  </code></pre>
  
  <p>I have <code>var persons = {...}</code> object and I display it like</p>
  
  <pre><code>&lt;div ng-repeat="person in persons"&gt;
    {{person.name...}}
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>How do I create a filter so each time I will click on one of the buttons the list will be filtered ?</strong></p>
  
  <p>I have tried adding<code>ng-repeat="person in persons | filter:filterPersons"</code>
  and on the script side to write:</p>
  
  <pre><code>$scope.filterPersons(person){
    if (person.name == "John")
      return person;
  }
  </code></pre>
  
  <p>but this is only one use-case (how can I filter by another name?) - in other words - <strong>How do I connect the links to the filter?</strong></p>