title: AngularJS ng-repeat filter specific nested property
body: <p>I am trying to filter an ngRepeat by a specific array attribute.</p>
  
  <p>js:</p>
  
  <pre><code>app.controller('UserIndexController', function ($scope, $http, $window) {
  
      $scope.search = {};
  
      $http({ method: 'GET', url: '/api/v2/group' })
          .success(function(data, status, headers, config) {
  
              $scope.groups = data;
  
          })
          .error(function(data, status, headers, config) {
  
          });
  
      $http({ method: 'GET', url: '/api/v2/user' })
          .success(function(data, status, headers, config) {
  
              $scope.users = data;
  
          })
          .error(function(data, status, headers, config) {
  
          });
  });
  </code></pre>
  
  <p>html:</p>
  
  <pre><code>&lt;div data-ng-controller="UserIndexController"&gt;
  &lt;select 
      ng-model="search.group" 
      ng-options="group.name as group.name for group in groups" 
      class="form-control"&gt;
      &lt;option value=""&gt;Filter Users by Group&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;table class="table table-responsive table-striped table-hover"&gt;
          &lt;thead&gt;
      &lt;tr&gt;
              &lt;th&gt;User Type&lt;/th&gt;
              &lt;th&gt;Email&lt;/th&gt;
          &lt;th&gt;Name&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
          &lt;tr data-ng-repeat="user in users | filter:search.group"&gt;
          &lt;td&gt;&lt;% user.groups[0].name %&gt;&lt;/td&gt;
          &lt;td&gt;&lt;% user.last_name %&gt;, &lt;% user.first_name %&gt;&lt;/td&gt;
          &lt;td&gt;&lt;% user.email %&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The above code searches through the entire user object. This behaviour is not wanted because if any other <code>user</code> data attributes match the string in the selected option, then this row will also be included in the filter.</p>
  
  <p>How do I ensure that the filter only works on the <code>user.groups[0].name</code> column?</p>
  
  <p><code>&lt;tr data-ng-repeat="user in users | filter:{user.groups[0].name: search.group}"&gt;</code> results in the following error: <code>Syntax Error: Token '[' is unexpected</code>.</p>
  
  <p>As such, I need something to either put <code>user.groups[0].name</code> directly into the user object so that the filter doesn't have to access it via the array, or a way of filtering on the array object.</p>