How to get the values of multiple checkboxes in AngularJS?

Question

In my app I got 7 checkboxes. I want to get the value of the selected checkbox and store into an object. Ff it is deselected I want to remove it in the object.

HTML

<span ng-repeat="days in selectDays">
    <input type="checkbox" id="{{days}}" ng-model="daysSelected"/>
    <label for="{{days}}">{{days}}</label>
</span>

Controller

$scope.selectDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
$scope.selectedList = {}; //this is the object to store the selected checkbox values

Answer 1

The following code is a simple approach -> check this plunker. This example delivers you a very simple KISS principle handling for mulitple autogenerated checkboxes in AngularJS.

Template

<span ng-repeat="day in selectDays">
    <input type="checkbox" id="{{day}}" ng-model="selectedList[day]"/>
    <label for="{{day}}">{{day}}</label>
</span>
<button ng-click="submit()">Submit</button>

Scopes

//default states
$scope.selectDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
$scope.selectedList = {};

/**
 * Action
 */
$scope.submit = function () {
    angular.forEach($scope.selectedList, function (selected, day) {
        if (selected) {
           console.log(day);
        }
    });
};