title: AngularJS multiple parameter filtering with circular dependency
body: <p>I'm trying to create an index of shops, showing them grouped by category, so i have two ng-repeat, one for the categories and another for the shops </p>
  
  <p>i have an array for the categories 
  (['cat1', 'cat2', ..]) </p>
  
  <p>and another with the shops 
  ([{name: 'shop1', categories: ['cat2', 'cat3']}, ..])</p>
  
  <p>Here's the HTML Code for the repeaters:</p>
  
  <pre><code>&lt;div ng-repeat="categoria in categorias | filter:categorySearch:strict"&gt;
      &lt;h3&gt;{{categoria}}&lt;/h3&gt;
      &lt;hr width="70%" align="left"&gt;
      &lt;table style="text-align: center;" class="col-xs-12 col-sm-12 col-md-12 table table-bordered table-striped" class="tabla_tiendas"&gt;
      &lt;tr ng-repeat="tienda in tiendas | filter:{agregada: 'false'} | filterByCategory:categoria:tienda" &gt;
          &lt;td class="col-xs-4 col-sm-4 col-md-4 tienda-{{tienda.seleccionada}}"&gt;&lt;input type="checkbox" ng-change="setPosition(tienda, tienda.seleccionada)" ng-model="tienda.seleccionada" value="{{tienda.id}}"&gt;&lt;/td&gt;
          &lt;td class="col-xs-4 col-sm-4 col-md-4 tienda-{{tienda.seleccionada}}"&gt;{{tienda.nombre}}&lt;/td&gt;
          &lt;td class="col-xs-4 col-sm-4 col-md-4 tienda-{{tienda.seleccionada}}"&gt;{{tienda.categorias}}&lt;/td&gt;
      &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>Here's the Angular Code:</p>
  
  <pre><code>app.filter('filterByCategory', function(tienda, categoria){
      return function(tienda, categoria){return _.contains(tienda.categorias, categoria);};
  });
  </code></pre>
  
  <p>And finally here are the errors:</p>
  
  <pre><code>Error: Circular dependency: 
      at Error (&lt;anonymous&gt;)
      at Object.c [as get] (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:26:368)
      at http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:108:41
      at l (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:70:141)
      at Oc.fa (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:74:463)
      at k (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:69:505)
      at Oc (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:75:29)
      at http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:78:241
      at Object.e.$watchCollection (http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:88:58)
      at http://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js:156:40 &lt;!-- ngRepeat: tienda in tiendas | filter:{agregada: 'false'} | filterByCategory:categoria:tienda --&gt; angular.min.js:63
  (anonymous function) angular.min.js:63
  (anonymous function) angular.min.js:53
  l angular.min.js:44
  e angular.min.js:39
  e angular.min.js:39
  e angular.min.js:39
  e angular.min.js:39
  (anonymous function) angular.min.js:38
  (anonymous function) angular.min.js:157
  (anonymous function) angular.min.js:89
  e.$digest angular.min.js:89
  e.$apply angular.min.js:91
  (anonymous function) angular.min.js:152
  (anonymous function) angular.min.js:23
  o angular.min.js:6
  c
  </code></pre>
  
  <p><strong>What is causing the circular dependency and how can i break it? i'm also open to another solution, but it can change the data architecture</strong></p>
  
  <p><strong>Edit:</strong> </p>
  
  <p>Here i have a jsFiddle with the problem: <a href="http://jsfiddle.net/truca/HB7LU/1458/" rel="nofollow">http://jsfiddle.net/truca/HB7LU/1458/</a>
  (if i use the filter "filterByCategory" i get the circular dependency, if i use the filter "filterByCategoryScope" i dont get the parameter category, so i can't filter)</p>