ngChecked, похоже, не хочет привязываться к модели. Зачем?

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() функция переключает $ scope.analytics между истинным и ложным и обновляет localstorage, чтобы отразить это.

Обратите внимание, что я использую методы $ localstorage. $ localstorage определяется в другой службе. Это позволяет вам легко и легко устанавливать объекты localStorage.

В любом случае, моя проблема очень проста, но непонятна. Я знаю, что могу изменить значение аналитики из журналов консоли, но независимо от того, что я делаю, этот флажок инициализируется.

Любые идеи?

Answer 1

Спасибо очень много для обратной связи.

@nickgraef для изменения меня к реальной проблеме - это .get() возвращает строку.

@tymeJV для поставки мне более элегантной версии моего собственного кода.

Это то, что я сделал в конце, это размытие обоих советов. Я конвертирую аналитическую переменную в логическую строку после того, как я .get() это из localstorage.

$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); 
} 

Answer 2

Вы должны использовать 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); 
}