Question

我正在努力解决我目前正在处理的一些Javascript问题。所以我有一个简单的Web应用程序，以下是AngularJS的东西：

ON stocks (item_id, enter_on DESC NULLS LAST)

}）;

    app.filter('startFrom', function () {
return function (input, start) {
    if (input) {
        start = +start;
        return input.slice(start);
    }
    return [];
};

所以我有这些，我有html侧面显示项目列表。用户可以选择从items数组中添加和删除这些项目。题。如何确保当用户在数组中添加或删除项目后，仍然可以在重新加载页面后看到编辑后的列表？有人可以建议一种处理它的方法吗？是否可以存储在cookie中，并在每次添加/删除操作后更新它们，如果是这样的话？

感谢

更新：所以我改变了脚本，但它似乎仍然无法正常工作。

    app.controller('MainCtrl', ['$scope', 'filterFilter', function ($scope, filterFilter) {
$scope.items = ["name 1", "name 2", "name 3"
];

$scope.addLink = function () {
    $scope.errortext = "";
    if (!$scope.newItem) {return;}
    if ($scope.items.indexOf($scope.newItem) == -1) {
        $scope.items.push($scope.newItem);
        $scope.errortext = "submitted";
    } else {
        $scope.errortext = " in list";
    }
};

}]）;

    var app = angular.module('App', ['ui.bootstrap']);

    app.filter('startFrom', function () {
       return function (input, start) {
       if (input) {
         start = +start;
         return input.slice(start);
       }
       return [];
       };
    });

    app.factory('ItemsService', ['$window', function($window) {
    var storageKey = 'items',_sessionStorage = $window.sessionStorage;
    return {
    // Returns stored items array if available or return undefined
    getItems: function() {
        var itemsStr = _sessionStorage.getItem(storageKey);

        if(itemsStr) {
            return angular.fromJson(itemsStr);
        }                      
    },
    // Adds the given item to the stored array and persists the array to sessionStorage
    putItem: function(item) {
        var itemsStr = _sessionStorage.getItem(storageKey),
        items = [];

        if(itemStr) {
            items = angular.fromJson(itemsStr);
        }

        items.push(item);

        _sessionStorage.setItem(storageKey, angular.toJson(items));
    }
 }

任何帮助如何修复它以及如何确保如果用户没有任何项目，它将使用默认的$ scope.items = [“name 1”，“name 2”，“name 3” ]。吗

Answer 1

您可以创建一个使用$cookies的简单获取/设置服务。它可能是这样的：

angular.module('myApp')
  .factory('ItemsService', ['$cookies', function($cookies) {
    var cookieName = 'items'
    return {
      get: function(defaults) {
        return $cookies.get(cookieName).split(',') || defaults
      },
      put: function(items) {
        var expireDate = new Date()
        expireDate.setDate(expireDate.getDate() + 1);
        $cookies.put(cookieName, items.join(','), { expires: expireDate } )
      }
    }
}]);

在您的控制器和主要功能

中加入ItemsService

$scope.items = ItemsService.get($scope.items)

将编辑后的列表存储在$cookies（如果有）中，并将列表保存在addLink()中

ItemsService.put($scope.items)

Answer 2

我想通过让他的服务使用sessionStorage来扩展@ davidkonrad的答案。由于使用sessionStorage最适合您的用例。

angular.module('myApp')
  .factory('ItemsService', ['$window', function($window) {
     var storageKey = 'items',
        _sessionStorage = $window.sessionStorage;

     return {
        // Returns stored items array if available or return undefined
        getItems: function() {
            var itemsStr = _sessionStorage.getItem(storageKey);

            if(itemsStr) {
                return angular.fromJson(itemsStr);
            }         

            return ['name1', 'name2', 'name3']; // return default value when there is nothing stored in sessionStore                
        },
        // Adds the given item to the stored array and persists the array to sessionStorage
        putItem: function(item) {
            var itemsStr = _sessionStorage.getItem(storageKey),
            items = [];

            if(itemStr) {
                items = angular.fromJson(itemsStr);
            }

            items.push(item);

            _sessionStorage.setItem(storageKey, angular.toJson(items));
        }
     }
}]);

从app.controller angularJS存储，更新和删除数据

2 个答案: