使用本地存储刷新页面后如何保持选中或取消选中复选框？答案

【问题标题】：How to keep checkbox checked or unchecked after page refreshed using local-storage?使用本地存储刷新页面后如何保持选中或取消选中复选框？
【发布时间】：2016-12-08 16:37:23
【问题描述】：

如何在 Angularjs 中使用本地存储刷新页面后保持复选框选中或取消选中？

这里我写了一些代码：

<ul class="custom-checkbox">
                <li ng-repeat="type in typeoffeatures">
                    <input type="checkbox" id="{{type.value}}" ng-checked=type.flagset ng-click="toggleSelection1(type.value)" value="{{type.value}}" required/>
                    <label for="{{type.value}}"><div class='custom-chkbox'>
                            <span>{{type.value}}</span>
                        </div></label>
                </li>
            </ul>

JS 代码：

   $scope.typeoffeatures = [{
           value : 'Authentication',
           flagset : true,
       },{
            value : 'Notification',
            flagset : false,
       },{
           value : 'Analytics',
            flagset : true,
       }];
  });

Codepen link here.

【问题讨论】：

标签： javascript html angularjs local-storage

【解决方案1】：

我对你的 codepen 做了一些调整：

在复选框中添加了ng-model
将ng-click 更改为ng-change（更可靠）

添加了ng-true-value和ng-false-value，将真假表示为字符串

<input type="checkbox" id="{{type.value}}" ng-model="type.flagset" 
       ng-change="saveField(type.value, type.flagset)"
       ng-true-value="'true'" ng-false-value="'false'" required/>

https://codepen.io/anon/pen/dOeKjj?editors=1010

【讨论】：