1

我开始了这段旅程，试图让一些设置与 localStorage 保持一致，但有一些问题并在此处发布（没有解决方案）：为什么此数据不绑定？Angularjs 中的一个奇怪案例

当我了解 ngStorage 时，我已经放弃了这种方法。理论上，ngStorage 可以让你双向绑定进出 Angular 模型。这是一个伟大的、伟大的理论。

不过，我遇到了问题。它工作了一半。

想法是这样的：

  1. 测试权限选择（真或假）。
  2. 如果没有选择（第一次使用）弹出一个选择。
  3. 存储选择。
  4. 重新启动时，使用存储的选项将权限设置为真或假。
  5. 允许用户在应用程序内更改权限。

它最多可以工作到 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。

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

4

1 回答 1

0

我遇到了与 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>

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

于 2016-01-21T01:55:24.117 回答