Question

我正在使用Ionic和angularjs，我正在尝试在localStorage中存储设置。

我有一个复选框，我想用它来打开或关闭分析。 html看起来像这样。

Analytics on/off
<label class="toggle toggle-balanced">
    <input type="checkbox" ng-click="toggleAnalytics()" ng-checked="analytics">
        <div class="track">
            <div class="handle"></div>
        </div>
</label>

在相关的控制器中我有：

$scope.analytics = $localstorage.get('analyticsOnOff');
$log.log("Analytics initialised at", $scope.analytics);

$scope.toggleAnalytics = function(){ 

   if($scope.analytics===true){
      $scope.analytics = false;
      $localstorage.set('analyticsOnOff', false);
   }else{
      $scope.analytics = true;
      $localstorage.set('analyticsOnOff', true);
   } 

 $log.log("Analytics is ", $scope.analytics);

}

正如您所看到的，当您更改复选框时，toggleAnalytics（）函数会在$和true之间切换$ scope.analytics，并更新localstorage以反映该内容。

请注意，我使用的是$ localstorage方法。 $ localstorage在另一个服务中定义。它允许您轻松设置和获取localStorage对象。

无论如何，我的问题很简单，但令人费解。我知道我可以从控制台日志中更改分析值，但无论我做什么，复选框都会初始化为。

有什么想法吗？

Answer 1

您应该在复选框上使用ng-model，这将处理设置实际属性 - 然后您可以使用change事件：

<input type="checkbox" ng-change="toggleAnalytics(analytics)" ng-model="analytics" />

控制器：

$scope.toggleAnalytics = function(isChecked) { 
   $localstorage.set('analyticsOnOff', isChecked);
   $log.log("Analytics is ", isChecked);
}

Answer 2

非常感谢你们的反馈。

@nickgraef改变我的真正问题 - .get（）返回一个字符串。

@tymeJV为我提供了更优雅的自己代码版本。

这就是我最后所做的，这是两个提示的混搭。我将分析变量转换为一个布尔值，直接来自localstorage我的.get（）。

$scope.analytics = $localstorage.get('analyticsOnOff');
$scope.analytics = ($scope.analytics == 'true' ? true : false);

$log.log("Analytics initialised at", $scope.analytics);

$scope.toggleAnalytics = function(isChecked) { 
   $localstorage.set('analyticsOnOff', isChecked);
   $log.log("Analytics is ", isChecked);
}

ngChecked似乎不想绑定到模型。为什么？

2 个答案: