AngularJs localStorage在循环中删除元素

时间:2015-03-20 03:23:53

标签: javascript angularjs local-storage ionic

我不知道如何在localStorage循环中删除元素 在保存方法中,我添加元素并检查它是否重复 请解释一下如何使用例如id或所有值

删除元素

我的工厂

.factory('SaveDocuments', function() {
        var documents = [];

            save: function (id, name, link) {
                if(documents.filter(function(a){return a.id==id}).length)
                { alert('conflict!'); }
                else {
                // add to it,
                documents.push({id: id, name: name, link: link});
                // then put it back.
                localStorage.setItem('document', JSON.stringify(documents));
                }

            },

            del: function(id, name, link) {
                if(documents.filter(function(a){return a.id==id}).length) {
                    for (i = 0; i < localStorage.length; i++){
                    key = localStorage.key(i);
                    value = localStorage.getItem(key);
                        localStorage.removeItem(value);
                    console.log(value);
                    break;
                }
                }
                else {
                    alert('conflict!');
                }
            }

        }

myController的

 .controller('PageSearchCtrl', function($scope, ConstSearch, SaveDocuments) {                          
     $scope.saveDocument = function() {                                                                
         //Create new project                                                                          
             $scope.document = [{"id": 1, "name": "new1", "link": "#/const"}];              
             SaveDocuments.save($scope.document[0].id,$scope.document[0].name,$scope.document[0].link);
     };                                                                                                
      $scope.deleteDocument = function () {                                                            
          $scope.document = [{"id": 1, "name": "new1", "link": "#/const"}];                 
          //Create new project                                                                         


SaveDocuments.del($scope.document[0].id,$scope.document[0].name,$scope.document[0].link);    
  }             

1 个答案:

答案 0 :(得分:0)

我建议您将服务更改为以下内容:

.factory('SaveDocuments', function () {
    var lsKey = 'document', // the key to store the docs in local storage under
        documents = JSON.parse(localStorage.getItem(lsKey) || '[]'); // initialise from localStorage

    function saveToLocalStorage() {
        localStorage.setItem(lsKey, JSON.stringify(documents));
    }

    return {
        save: function (id, name, link) {
            if (documents.filter(function (a) {
                return a.id == id;
            }).length) {
                alert('conflict!');
            } else {
                // add to it,
                documents.push({
                    id: id,
                    name: name,
                    link: link
                });
                saveToLocalStorage();
            }

        },

        del: function (id, name, link) {
            // clear all if del() is called with no arguments or null for all args
            if (!id && !name && !link) {
                documents = [];
                saveToLocalStorage();
                return;
            }
            var initialLength = documents.length;
            documents = documents.filter(function (doc) {
                return (!id || doc.id !== id) && (!name || doc.name !== name) && (!link || doc.link !== link);
            });
            // if nothing was removed, show error
            if (documents.length === initialLength) {
                alert('conflict!');
            } else {
                saveToLocalStorage();
            }
        }
    };
});

请注意,我在应用程序启动时从本地存储状态正确初始化它(因此当您重新加载页面时数据正确存在时),使用变量来保存用于将数据存储在本地存储中的唯一键(保持代码DRY),修复你的del()方法,使其保留与删除条件不匹配的方法,或者在没有传入参数的情况下删除所有内容,然后用更新后的状态覆盖本地存储中的值。

NB:你应该测试一下,我没有做任何测试,看看是否有效。