title: How do I filter an array with AngularJS and use a property of the filtered object as the ng-model attribute?
body: <p>If I have an array of objects, and I want to bind the Angular model to a property of one of the elements based on a filter, how do I do that? I can explain better with a concrete example:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html ng-app&gt;
      &lt;head&gt;
          &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"&gt;&lt;/script&gt;
          &lt;meta charset=utf-8 /&gt;
          &lt;title&gt;JS Bin&lt;/title&gt;
      &lt;/head&gt;
      &lt;body ng-controller="MyCtrl"&gt;
          &lt;input ng-model="results.year"&gt;
          &lt;input ng-model="results.subjects.title | filter:{grade:'C'}"&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>function MyCtrl($scope) {
    $scope.results = {
      year:2013,
      subjects:[
        {title:'English',grade:'A'},
        {title:'Maths',grade:'A'},
        {title:'Science',grade:'B'},
        {title:'Geography',grade:'C'}
      ]
    };
  }
  </code></pre>
  
  <p>JSBin: <a href="http://jsbin.com/adisax/1/edit" rel="noreferrer">http://jsbin.com/adisax/1/edit</a></p>
  
  <p>I want to filter the second input to the subject with a grade 'C', but I don't want to bind the model to the <em>grade</em>; I want to bind it to the <em>title</em> of the subject that has grade 'C'.</p>
  
  <p>Is this possible, and if so, how is it done?</p>