title: Filter ng-repeat based on user selection
body: <p>I am currently working on a music catalog and trying to implement functionality to allow user to filter the catalog from a list of <strong>artists</strong> and <strong>genres</strong></p>
  
  <p>The list:</p>
  
  <pre><code>    &lt;ul class="artists"&gt;
          &lt;li class="title"&gt;
              &lt;h5&gt;Artists&lt;/h5&gt;
              &lt;ul class="sub-menu"&gt;
                  &lt;li ng-repeat="artist in music | orderBy:'-views'"&gt;
                      &lt;p ng-click="select(artist.artist)"&gt;{{artist.artist}}&lt;/p&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>I have tried to build a custom filter but couldn't quite grasp the concept, what I managed to do - was get the value from the chosen selection</p>
  
  <pre><code>    // value from ng-click
      $scope.select = function(value){
          filterBy = value;
      }
  </code></pre>
  
  <p>I know i can add in filter: the ng-repeat by adding</p>
  
  <pre><code>ng-repeat="artist in music | filter: {artist:'artistName' | orderBy:'-views'"}
  </code></pre>
  
  <p>but how do i change the <strong>artist: 'value'</strong> to what ever use selects from a list</p>
  
  <p>this is the main area i am trying to filter</p>
  
  <pre><code>    &lt;div class="item" ng-repeat="artist in music | orderBy:'-views'"&gt; 
          &lt;div class="img"&gt;
              &lt;img ng-src="{{artist.image}}"/&gt;
          &lt;/div&gt;
          &lt;div class="info"&gt;
              &lt;h6&gt;{{artist.artist}}&lt;/h6&gt;
              &lt;p&gt;{{artist.songName}}&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>When the view loads all items should show and then if user wants can select artist or genre from a list to filter to that result. My idea was to maybe place the custom filter function inside the click function, so when user selects from list the value from the click function could be parse into the custom filter and update the filter with correct value. But, I couldn't implement this.</p>
  
  <p>I am quite new to angular.js so if i didn't quite explain it correctly here is a JSfiddle replicating my project.</p>
  
  <p><a href="http://jsfiddle.net/0n2qptg6/5/" rel="nofollow">http://jsfiddle.net/0n2qptg6/5/</a></p>
  
  <p>Thanks in advance for any help, suggestions, criticisms</p>