Use checkboxes in angularjs to manage array of objects

Question

I had asked a question about How to associate objects as models using ng-options in angularjs.

And I got an awesome answer very fast. My followup questions is that the

Answer 1

You just need some intermediate value in your scope, and bind checkboxes to it. In your controller - watch for it changes, and manually reconstruct shirt.colors, according to it value.

  
Shirt.
  Size: 

  Colors:
  
    {{color.label}} 
  

    

And in your controller:

$scope.selection = [[],[]];
$scope.$watch('selection', function () {
  console.log('change', $scope.selection);
  angular.forEach($scope.selection, function (shirtSelection, index) {
    $scope.shirts[index].colors = [];
    angular.forEach(shirtSelection, function (value, index2) {
      if (value) $scope.shirts[index].colors.push($scope.colors[index2]);
    });
  });
}, true);

You can test it here: http://plnkr.co/edit/lh9hTa9wM5fkh3nT09RJ?p=preview