Follow by Email

AngularJS using $localStorage

Maintaining state of Multiple check boxes using local storage in Angular JS
Controller : index.js


        
  app.controller('checkBoxController', function ($scope, $localStorage) {
    
      if($localStorage.user_type == undefined) {
        $scope.users_type=[{name:'Vendor (90%) + ', value:'Vendor', checked: true},
                            {name:'User (90%) + ',value:'User', checked: true},
                            {name:'Mnm Analyst (90%) + ',value:'Mnm_Analyst', checked: true},
                            {name:'Industry (90%) + ',value:'Industry', checked: true}];
                            
                             $localStorage.user_type = $scope.users_type;                
      } else{
                            
            function functiontofindIndexByKeyValue(arraytosearch, key, valuetosearch) {
    
                for (var i = 0; i < arraytosearch.length; i++) {
                
                    if (arraytosearch[i][key] == valuetosearch) {
                      return i;
                    }
                }
                return null;
            }                        
                            
        $scope.users_type=[$localStorage.user_type[0],$localStorage.user_type[1],$localStorage.user_type[2],$localStorage.user_type[3]];
                    
      }                              
 $scope.selection=[$scope.users_type[0],$scope.users_type[1],$scope.users_type[2],$scope.users_type[3]];
            // toggle selection for a given employee by name
            $scope.toggleSelection = function toggleSelection(employeeName) {

            $localStorage.user_type = $scope.selection;    

            var idx = $('#' + employeeName).prop("checked");

            var index = functiontofindIndexByKeyValue($scope.users_type, "value", employeeName);

                // is checked
                if (idx == false) {
                  
                 $localStorage.user_type[index].checked = 'false';                  
                
                }

                // is unchecked
                else {
                    
                $localStorage.user_type[index].checked = 'true';
                }
                
      };

});
        


View :   Index.html


        
  <div class="digreeWrap" ng-controller="checkBoxController">
<div class="digreeChkWrap">
<div class="checkbox" ng-repeat="user in users_type">
<label>

                    <input id="{{user.value}}" ng-checked="{{user.checked}}" ng-click="toggleSelection(user.value)" type="checkbox" value="{{user.value}}" />

                    <span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>

                    {{user.name}}

                    </label>

                </div>
</div>
<div class="count">
= 360 <i class="fa fa-circle-o countD"></i></div>
</div>