title: AngularJS display array based off checkbox selection
body: <p>I have 4 check boxes, and depending on which one/pair is selected I want a specific array to be displayed on the page. I'm relatively new to angularjs so I'm not sure how to get this to work. So how do I a) check which check box is selected through angular, b) print out the specific array, and c) if "Do Nothing" is selected a message will appear instead of the array. The content should be dynamic so if i choose a different check box the content will change as well. <a href="http://codepen.io/MarkBond/pen/gpJWKe?editors=101" rel="nofollow">http://codepen.io/MarkBond/pen/gpJWKe?editors=101</a> the "Simple Form Object" is just to show what that current boolean value is not the array of names that are supposed to appear.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;html ng-app="myApp"&gt;
   .....
   &lt;body ng-controller="FormController"&gt;
   &lt;form&gt;
    &lt;div class="checkbox"&gt;
      &lt;label&gt;
        &lt;input type="checkbox" name="displayOption" ng-model="formData.displayOption.fiftyMill"/&gt;50 million
      &lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="checkbox"&gt;
      &lt;label&gt;
        &lt;input type="checkbox" name="displayOption" ng-model="formData.displayOption.hundredMill" /&gt;100 million
      &lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="checkbox"&gt;
      &lt;label&gt;
        &lt;input type="checkbox" name="displayOption" ng-model="formData.displayOption.statusQuo"/&gt;Status Quo
      &lt;/label&gt;
    &lt;/div&gt;
    &lt;div class="checkbox"&gt;
      &lt;label&gt;
        &lt;input type="checkbox" name="displayOption" ng-model="formData.displayOption.doNothing"/&gt;Do Nothing
      &lt;/label&gt;
    &lt;/div&gt;
    &lt;div ng-repeat="ActionController as actionCtrl"&gt;
      &lt;a&gt;{{ page.name }}&lt;/a&gt;
      {{ message }}
    &lt;/div&gt;
  &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>AngularJS</strong></p>
  
  <pre><code>angular.module('myApp', [])
  
  .controller('FormController', ['$scope' ,function($scope) {
  
    // Just for outputting data
    $scope.formData = {};
  
      // Trying to place the boolean value of each checkbox into a variable
      var value1 = '$scope.fiftyMill';
      var value2 = '$scope.hundredMill';
      var value3 = '$scope.statusQuo';
      var value4 = '$scope.doNothing';
  
      // Checks to see which checkbox is selected then outputting array 
      // associated with selection 
      if (value1 === true || value2 === true) {
          this.page = groupOne
      } else if (value3 === true) {
          this.page = groupTwo
      } else if (value1 === true || value2 === true &amp;&amp; value3 === true) {
          this.page = groupThree + groupOne + groupTwo
      }else{
          this.message = 'No Options'
      }
  
      // Array gtoups
      var groupOne = [
        { name: 'BudgetCharts'},
        { name: 'BudgetComparison'},
        { name: 'EDITBudgetAmounts'}
      ]
  
      var groupTwo = [
        { name: 'Optimize'},
        { name: 'ReviewAndAdjust'}
      ]
  
      var groupThree = [
          { name: 'Export'},
          { name: 'Import'},
          { name: 'Construction Program'},
          { name: 'ExportStrategies'}
      ]
  }]);
  </code></pre>
  
  <p>Updated question with how my current code works also with a workable codepen</p>