title: Angular Check All button
body: <p>I have a handful of simple checkbox lists that I need to create for an application. I built a "Check All" button for my initial test and it worked beautifully. But, when I changed the code to fetch a subset of the list via a Node call, the list still appeared as expected, but the Check All functionality no longer did. In my initial test, the list was just an array of objects with "description" and "value" but after inserting Node into the middle, the objects also had a $$hashkey property. I'm not sure if this is the source of the problem, but if someone could take a look and tell me what's wrong, I'd appreciate it.</p>
  
  <p>My HTML looks like this:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-md-3" id="semRushApiList_None"&gt;
      &lt;input type="checkbox" value="semRushCheckAll_None" name="semRushCheckAll_None" ng-click="toggleSemRushApiTypes_None()" /&gt;&lt;strong&gt;Check All&lt;/strong&gt;
      &lt;div ng-repeat="apiCall in semRushApiTypes_None"&gt;
          &lt;input type="checkbox" name="selectedSemRushApiTypes_None[]" value="{{apiCall.apiName}}" ng-checked="selectedSemRushApiTypes_None.indexOf(apiCall) &gt; -1" ng-click="toggleSemRushApiSelection_None(apiCall)" /&gt; {{apiCall.description}}
      &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My angular js looks like this:</p>
  
  <pre><code>    $scope.semRushCheckAll_None = false;
      $scope.semRushApiTypes_None = [];
      fetchApiTypesByCategory("none").then(function(types){
          $scope.semRushApiTypes_None = types;
      });
  
      $scope.selectedSemRushApiTypes_None = [];
  
      $scope.toggleSemRushApiTypes_None = function() {
          $scope.semRushCheckAll_None = !$scope.semRushCheckAll_None;
          if ($scope.semRushCheckAll_None) {
              $scope.selectedSemRushApiTypes_None = angular.copy($scope.semRushApiTypes_None);
          } else {
              $scope.selectedSemRushApiTypes_None = [];
          }
      };
  
      $scope.toggleSemRushApiSelection_None = function(apiCall) {
          var idx = $scope.selectedSemRushApiTypes_None.indexOf(apiCall);
          if (idx &gt; -1) {
              $scope.selectedSemRushApiTypes_None.splice(idx, 1);
          } else {
              $scope.selectedSemRushApiTypes_None.push(apiCall);
              console.log(JSON.stringify($scope.selectedSemRushApiTypes_None));
          }
      };
  
      function fetchApiTypesByCategory(category) {
          var deferred = $q.defer();
  
          $http.get(rootApiUrl + "/fetchSemRushApiTypesByCategory?category=" + category).then(function(response) {
              deferred.resolve(response.data);
          }, function(response){
              deferred.reject("Error: " + response.data);
          });
          return deferred.promise;
      }
  </code></pre>
  
  <p>The node call looks like this:</p>
  
  <pre><code>server.route({
      method:"GET",
      path:"/fetchSemRushApiTypesByCategory",
      handler:function(request,reply){
          var q = Qs.parse(request.query);
          return reply(factory.createApiTypeList(q["category"])).code(200);
      }
  });
  </code></pre>
  
  <p>and the factory looks like this:</p>
  
  <pre><code>exports.createApiTypeList = function(category) {
      var result = [];
      for (var i = 0; i &lt; semRushApiJson.length; i++) {
          if (semRushApiJson[i].category === category) {
              var description = semRushApiJson[i].description;
              var apiName = "";
              for (var p = 0; p &lt; semRushApiJson[i].params.length; p++) {
                  if (semRushApiJson[i].params[p].key == "type") {
                      apiName = semRushApiJson[i].params[p].value;
                      break;
                  }
              }
              result.push({
                  "description": description,
                  "apiName": apiName
              });
          }
      }
      return result;
  };
  </code></pre>
  
  <p>Some simple console.log statements have proven that things are being populated as expected, with the exception of the $$hashkey property on the objects coming out of the Node call.</p>
  
  <p>When I check the checkboxes individually, the selected array is populated with a value that doesn't have the $$hashkey and when I check the check all, the selected list gets all of the appropriate values including the $$hashkey, but the checkboxes do not get updated on the UI like they did before I moved the populating of the list to a Node call.</p>
  
  <p>Can anyone tell me what I'm doing wrong here?</p>
  
  <p>V</p>