Question

我开始尝试使用localStorage进行一些设置以保留一些设置，遇到一些问题并在此处发布（没有解决方案）：Why won't this data bind? An odd case in Angularjs

我在学习ngStorage时放弃了这种方法。理论上，ngStorage允许您双向绑定到Angular模型和从Angular模型中绑定。这是一个伟大的伟大理论。

我遇到了问题。它一半有效。

这些想法是这样的：

测试权限选择（true或false）。
如果没有选择（第一次使用）弹出一个选项。
存储选择。
重新启动时，使用存储的选项将权限设置为true或false。
允许用户更改应用内的权限。

最高可达4号。

测试显示，虽然在第一次使用时我可以将$ storage.analytics设置为true或false后续更改不从本地存储中存储和检索。

以下是代码：

permissionCallback = function(permission){  
  if(permission===1){
      console.log("analytics allowed");
      analytics.startTrackerWithId('UA-45544004-1'); 
      $scope.$storage.analytics=true;
      navigator.notification.alert('You can turn analytics off in the Data Tracking section at any time.', null, 'Analytics On', 'OK');
  }else{
      console.log("analytics denied");
      $scope.$storage.analytics=false;
      navigator.notification.alert('You can turn analytics on in the Data Tracking section at any time.',null , 'Analytics Off', 'OK');
  }
}

if(typeof $scope.$storage.analytics === 'undefined'){
  navigator.notification.confirm('This app would like your permission to collect data on how you use the app. No personal or user identifiable data will be collected.', permissionCallback, 'Attention', ['Allow','Deny']);
}
else{
  console.log('start analytics are', $scope.$storage.analytics); 
  if(typeof analytics !== 'undefined'){
    console.log("analytics functioning");
    analytics.startTrackerWithId('UA-45544004-1'); 

      $scope.trackClick = function(category, action){
        analytics.trackEvent(category, action); 
        console.log('Tracking category: ' + category + ', Section: ' + action + '.');
      }
  }
}
$scope.counter = 0;
$scope.change = function(){
  $scope.counter++;
  console.log('analytics are ' + $scope.$storage.analytics);
}

这是html。

<li class="item item-toggle">
<i class="icon ion-cloud"></i> Data Tracking is {{$storage.analytics}} {{counter}}
<label class="toggle toggle-balanced">
<input type="checkbox" ng-model="$storage.analytics" ng-change="change()">
     <div class="track">
             <div class="handle"></div>
    </div>
  </label>
</li>

这或者是我的逻辑错误，或者我认为这更可能是对数据范围的误解。

奇怪的是，change（）函数中的控制台日志（纯粹用于跟踪这些内容）始终是正确的。所以在html中使用$ storage.analytics是正确的方法（使用$ scope.storage.analytics导致各种错误），它确实从html绑定到$ scope.storage.analytics。

那么为什么在使用切换时不能将它保存到本地存储？

Answer 1

我遇到了与ng-storage类似的问题。加载/重新加载页面时，$ sessionStorage中绑定到值的任何内容都已正确更新。但是之后对$ sessionStorage的任何更改都没有反映在我的视图中。我最终做的是创建一个存储更改的服务，并使用$ sessionStorage作为临时数据存储。

app.controller('TestController', funciton($scope, $sessionStorage, Service) {
    // if we have session data set our service
    if($sessionStorage.data) {
        Service.data = $sessionStorage.data;
    } else {
        $sessionStorage.data = {};
    }

    // now bind scope to service
    scope.data = Service.data;

    // on update we set both Service and $sessionStorage
    // scope.data will be automatically updated
    scope.update = function(val)  {
        Service.data.value = val;
        $sessionStorage.data.value = val;
    }
});

app.service('TestService', function() {
    var service = {
        data: {
            value: 'Hello World'
        }
    };
    return service;
});

<div ng-controller="TestController">{{data.value}}</div>
<button ng-click-"update('Hello Universe')">Update</button>

这是我的解决方案如何运作的一个非常基本的例子，但希望它能让其他任何人在正确的轨道上陷入同样的境地。

使用ngStorage将数据绑定到localStorage - 这里有什么问题？

1 个答案: