JSFiddle - React, Tailwind, and code Playground

by Guddu Kumar

HTML

<form action="#" ng-controller='MyCtrl'>
    <div class="control-group" ng-repeat="story in stories"> <br>
        <input type="checkbox" ng-model="story.selectionAll">
        <label class="control-label">IncludeAll {{story}}</label>
            <div class="controls">
                <label class="checkbox inline" ng-repeat="browser in browsers">
                    <input type="checkbox" value="{{browser}}" ng-model="selection[story].browsers[browser]"
                    ng-checked="story.selectionAll"> {{browser}}
                    </label>
                </div>
        </div>
    </div>
    <pre>{{selection | json }}</pre>
</form>

JavaScript

function MyCtrl($scope) {
debugger
    $scope.stories = ['1', '2', '3'];
    $scope.browsers = ['IE', 'Chrome', 'Firefox','Safari','Opera'];
    $scope.selection = {};
   
    angular.forEach($scope.stories, function(story) {
   
        $scope.selection[story] = {
            browsers: {},
        };
    });
    
    
}