title: Angular JS - Creating a filter to compare 2 arrays
body: <p>I am developing a search page for an application. I have searched a lot at google, but I can't find anything than fragmented information about filters.</p>
  
  <p>What I need is a list of checkboxes containing certain lists of elements (like in the example, languages). I had put a filter for ordering, for the name of the client, but I want to add filters to auxiliar tables like (as I said) languages.</p>
  
  <p><strong>Clients:</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>$scope.clientes = [
      { 'id': '3', 'name': 'Susana', 'surname': 'Rodr&amp;iacute;guez Torr&amp;oacute;n', 'languages': [{'id': 1, 'name': 'english'}, {'id': 2, 'name': 'spanish'}] },
      { 'id': '4', 'name': 'Pablo', 'surname': 'Campos P&amp;eacute;rez', 'languages': [{'id': 3, 'name': 'german'}, {'id': 5, 'name': 'japanese'}] }
  ];
  </code></pre>
  
  <p><strong>Languages:</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>$langs = [
       {'id': 1, 'name': 'english' },
       {'id': 2, 'name': 'spanish' },
       {'id': 3, 'name': 'german' },
       {'id': 4, 'name': 'japanese' }
  ];
  </code></pre>
  
  <p><strong>HTML (for checkboxes list):</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;div class="row"&gt;
    &lt;div class="col-md-12"&gt;
      &lt;h4&gt;Languages&lt;/h4&gt;
      &lt;div class="checkbox-block" ng-repeat="lang in langs"&gt;
        &lt;label class="checkbox" for="{{lang.id}}"&gt;
          &lt;input type="checkbox" ng-model="langs[lang.id]" name="languages_group" id="{{lang.id}}" /&gt;
          &lt;span ng-bind-html="lang.name"&gt;&lt;/span&gt;
        &lt;/label&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;;
  </code></pre>
  
  <p>Clients:</p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;div class="client-wrapper" ng-repeat="client in clients | orderBy:order_field:order_type | filter:query"&gt;
      ... all the data of every client showed here ...
  &lt;/div&gt;;
  </code></pre>
  
  <p>In the array <code>$scope.langs</code> I havethe checks checked, now I want to compare it with every client and to show only the clients having that language(s). Can it be done? Can you help me to know how??</p>
  
  <p><strong>EDIT:</strong> <em>Code of the filter.</em></p>
  
  <pre class="lang-js prettyprint-override"><code>    app.filter('langsFilter', function () {
          return function (input, $scope) {
              var output = [];
              to_langs = $scope.filters.langs;
  
  
              var trueContro = false;
              for (var lang in to_langs) {
                  if (to_langs[lang] === true) {
                      trueContro = true;
                  }
              }
  
              for (var client in input) {
                  for (var i = 0; i &lt; input[client].langs.length; i++) {
                      if (trueContro === true) {
                          if (to_langs[client.langs[i]]) {
                              output.push(input[client]);
                          }
                      } else {
                          output.push(input[client]);
                      }
                  }
              }
  
              return output;
          };
      });
  </code></pre>
  
  <p>As you said I posted the code I am working at. It doesn't works right now, I know, but It will give you an idea of what I need to achieve:</p>
  
  <p>We have a set of clients, in addition to another filters, this filter will compare the langs of every client for show only the client with those langs.</p>