title: Filtering ng-repeat list using checkboxes and AngularJS
body: <p>I've read a lot of other posts on this and they all tend to describe uniquely complicated solutions. I just want to filter a list of items based on the checkboxes I click (I need an 'AND' Filter &amp; be able to see all items initially until a checkbox is clicked). </p>
  
  <p>This seems like it should be a piece of cake with AngularJS, But I'm just not getting it. how can I modify my code to make the filtering work?</p>
  
  <p>Here is my incomplete JSFiddle: <a href="http://jsfiddle.net/mromrell/qx3cD/1/">http://jsfiddle.net/mromrell/qx3cD/1/</a></p>
  
  <p><strong>Updated Fiddle here</strong>: <a href="http://jsfiddle.net/mromrell/qx3cD/7/">http://jsfiddle.net/mromrell/qx3cD/7/</a></p>
  
  <p>Thank you in Advance!</p>
  
  <pre><code>&lt;div ng-controller="MyCtrl"&gt;
  &lt;li class="no-decoration" ng-repeat="tech in technologyArray"&gt;
      &lt;label&gt;
          &lt;input type="checkbox" ng-model="strict" /&gt;{{tech}}&lt;/label&gt;
  &lt;/li&gt;
  &lt;hr&gt;
  &lt;div ng-repeat="portfolioItem in portfolioArray | filter:strict" class="ng-scope"&gt;
       &lt;h3&gt;{{portfolioItem.name}}&lt;/h3&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>var myApp = angular.module('myApp', []);
  
  function MyCtrl($scope) {
      $scope.technologyArray = ["HTML", "CSS", "Django", "Python", "AngularJS", "Javascript", "3rd party Payment API", "3rd party Libraries", "Jquery", "RestfulAPI", "AAAAAHH", "NodeJS", "Mongo", "Express", "Jade", "Wordpress", "MySQL", "Joomla", "Magento", "Jira"]
  
  $scope.portfolioArray = [{
      "id": "1",
      "name": "Storm Pig",
      "technology": ["HTML", "CSS", "Django", "Python", "AngularJS", "Javascript", "3rd party Payment API", "3rd party Libraries"]
  }, {
      "id": "2",
      "name": "Placer",
      "technology": ["HTML", "CSS", "Django", "Python", "AngularJS", "Javascript", "Jquery"]
  }, {
      "id": "3",
      "name": "Custom Proposal App",
      "technology": ["RestfulAPI", "AAAAAHH", "AngularJS", "HTML", "CSS", "Javascript", "NodeJS", "Mongo", "Express", "Jade"]
  }, {
      "id": "4",
      "name": "21 Zero",
      "technology": ["HTML", "CSS", "Wordpress", "MySQL"]
  }, {
      "id": "5",
      "name": "Detour Journal",
      "technology": ["HTML", "CSS", "Joomla", "MySQL"]
  }, {
      "id": "6",
      "name": "Dex Custom Websites",
      "technology": ["HTML", "CSS", "Wordpress", "MySQL", "Magento", "Jira"]
  }, {
      "id": "7",
      "name": "Conversion Jump",
      "technology": ["HTML", "CSS", "Joomla", "MySQL"]
  }, {
      "id": "8",
      "name": "The Canyons Pass",
      "technology": ["HTML", "CSS", "Joomla", "MySQL"]
  }]
  </code></pre>
  
  <p>}</p>