0

我正在使用LocalForage 库在我的网络应用程序中保存离线数据。

我有一个单独的服务来获取和设置索引数据库的值。服务如下，

var service = angular.module("DBService",[]);

service.factory('$dbService', function($q){
// Configuration
drivers = [localforage.INDEXEDDB, localforage.LOCALSTORAGE];
localforage.config({
    driver: drivers,
    name:"Cars"
});
localforage.setDriver(localforage.INDEXEDDB);
//
var _set = function(key_,value_){
    //
    var defered = $q.defer();
    localforage.setItem(key_, value_).then(
        function(data){
            //
            defered.resolve(data);
        }
    );
    return defered.promise;
};
var _get = function(key_){
    var defered = $q.defer();
    localforage.getItem(key_).then(
        function(data){
            //
            defered.resolve(data);
        }
    );
    return defered.promise; 
};

return {
    _set: _set,
    _get: _get
}

});

以下是观点，

<html ng-app="App">
<head>
<script src="angular.min.js"></script>
<script src="localforage.js"></script>
<script src="service.js"></script>
<script src="main.js"></script>
<title>Angular App</title>
</head>
<body>
<div ng-controller="DatabaseController" id="main" ng-init="pageInit()">
    <button ng-click="saveAsync(4)">click</button>
    <button ng-click="saveAsync2(5)">click</button>
</div>
</body>
</html>

以下是控制器，

var app = angular.module("App",['DBService']);

app.controller('DatabaseController', function($scope, $dbService){
//
$scope.pageInit = function(){
    //
    var initialize = [1,2,3];
    $dbService._set('List', initialize).then(
        function(data){
            //
            console.log("init : " + JSON.stringify(data));
        }
    );
};
//
$scope.$saveAsync = function(value_){
    //
    $dbService._get('List').then(
        function(data){
            //
            console.log("async operation : " + JSON.stringify(data));
            var tempList = data;
            tempList.push(value_);  
            $dbService._set('List',tempList).then(
                function(data){
                    //
                    console.log("async operation resolved : " +  data);
                }
            );
        }
    );
};
//
$scope.saveAsync = function(value_){
    //
    $scope.$saveAsync(value_);
};
//
$scope.saveAsync2 = function(value_){
    //
    $scope.$saveAsync(value_);
};
//
setInterval(function() {
    $scope.$saveAsync(6);
    $scope.$saveAsync(7);
}, 1000);
});

问题发生在 setInterval 因为它会使用不同的参数调用 $scope.$saveAsync() 方法两次。但是在解决这两个承诺时，根据这种情况，它们只包含初始值 1,2,3。因此程序将在第一个 $scope.$saveAsync() 方法调用中设置 1,2,3,6，在第二个 $scope.$saveAsync() 方法调用中设置 1,2,3,7。最后只有 1,2,3,7 将被保存在 indexeddb 中，缺少值 6。

有一个 $q.all 可以解决这个问题。但它仅适用于 setInterval 范围内。因为用户可以在 setInterval 点对相同的数据进行读写操作，也可以指向相同的数据运行。

同样，当我尝试同时多次获取特定键值并尝试更新该键的值时，就会出现问题。因为调用 get() 方法有时会返回旧数据集，因为 get 调用将是异步的。因此，当在旧数据集中调用 set 方法时，索引数据库中存在松散的数据。

谢谢指教。

4

0 回答 0