Ionic/Angular:本地存储中的读写数组

Zek*_*eke 6 javascript arrays local-storage angularjs ionic-framework

我正在使用Ionic框架作为在线课程的一部分,我正在学习AngularJS以及许多其他对Web开发人员有用的工具.而且,作为一种先进的初学者类型,我被困住了.在本单元中,我们学会利用本地存储在本地保存数据,这样即使应用程序关闭后我们也可以获取我们喜欢的项目.但是,我无法让它工作.

所以这就是我所做的:

失败的尝试

我可以将数据导入本地存储.我可以附加数据.我这样做是使用这个函数:

$scope.favoriteData = $localStorage.getObject('favorites', '[]');

$scope.addFavorite = function (index) {
    console.log('Current Favorites', $scope.favoriteData);
    $scope.favoriteData =  Object.keys($scope.favoriteData).map(function(k) { return $scope.favoriteData[k] });
    console.log ($scope.favoriteData);
    $scope.storeVar = $scope.favoriteData.push("'{id':" + index + '},');
    console.log ($scope.favoriteData);
    $localStorage.storeObject('favorites', $scope.favoriteData);
    console.log('Added Favorite', $scope.favoriteData)
};
Run Code Online (Sandbox Code Playgroud)

在本地存储中,这会生成以下条目:

favorites: ["'{id':0},","'{id':1},"]
Run Code Online (Sandbox Code Playgroud)

到现在为止还挺好.但是,这没用.因为我需要这个对象具有以下格式:

favorites: [{'id':0}, {'id':1}]
Run Code Online (Sandbox Code Playgroud)

等等.此外,我不应该添加重复项.我在其他地方有一种功能,但我仍然坚持如何结合这两个功能.

我的功能是这样的:

function (index) {
        for (var i = 0; i < favorites.length; i++) {
            if (favorites[i].id == index)
                return;
        }
        favorites.push({
            id: index
        });
    };
Run Code Online (Sandbox Code Playgroud)

这个问题是,我不明白它是如何做的.

那么请帮忙吗?

编辑#1:

第二次尝试

在@Muli和@ It-Z的帮助下,我正在使用以下代码:

$scope.favoriteData = $localStorage.getObject('favorites', '[]');

$scope.addFavorite = function (index) {
    console.log('Current Favorites', $scope.favoriteData);
    $scope.favoriteData =  Object.keys($scope.favoriteData).map(function(k) { return $scope.favoriteData[k] });
    console.log ($scope.favoriteData);
    for (var i = 0; i < favorites.length; i++) {
        if (favorites[i].id == index) {
            console.log ("Found duplicate id " + favorites[i].id);
            return;
        }
    }
    $scope.storeVar = $scope.favoriteData.push({id: index});
    console.log ($scope.favoriteData);
    $localStorage.storeObject('favorites', $scope.favoriteData);
    console.log('Added Favorite', $scope.favoriteData)
};
Run Code Online (Sandbox Code Playgroud)

但是,这不起作用,因为使用不存在的键favorites,它不起作用并给我一个错误.所以我需要实现一个检查,如果密钥存在,如果不存在,那么它应该创建一个.我看过这个问题,但它没有用,主要是因为我必须使用以下工厂services.js来访问本地存储:

.factory('$localStorage', ['$window', function ($window) {
    return {
        store: function (key, value) {
            $window.localStorage[key] = value;
        },
        get: function (key, defaultValue) {
            return $window.localStorage[key] || defaultValue;
        },
        storeObject: function (key, value) {
            $window.localStorage[key] = JSON.stringify(value);
        },
        getObject: function (key, defaultValue) {
            return JSON.parse($window.localStorage[key] || defaultValue);
        }
    }
}])
Run Code Online (Sandbox Code Playgroud)

所以这就是我现在所处的位置.我仍然被困住了.或者再次卡住了.我不知道.

It-*_*t-Z 2

首先,这一行:

$scope.storeVar = $scope.favoriteData.push("'{id':" + index + '},');
Run Code Online (Sandbox Code Playgroud)

应该:

$scope.storeVar = $scope.favoriteData.push({id: index});
Run Code Online (Sandbox Code Playgroud)

这是因为在原来的行中,favoriteData当您想要对象时,您将字符串推入其中。

如果你想首先检查重复项,你可以这样做:

$scope.favoriteData = $localStorage.getObject('favorites', []);

$scope.addFavorite = function (index) {
    console.log('Current Favorites', $scope.favoriteData);
    $scope.favoriteData =  Object.keys($scope.favoriteData).map(function(k) { return $scope.favoriteData[k] });
    console.log ($scope.favoriteData);
    for (var i = 0; i < favorites.length; i++) {
        if (favorites[i].id == index) {
            console.log ("Found duplicate id " + favorites[i].id);
            return;
        }
    }
    $scope.storeVar = $scope.favoriteData.push({id: index});
    console.log ($scope.favoriteData);
    $localStorage.storeObject('favorites', $scope.favoriteData);
    console.log('Added Favorite', $scope.favoriteData)
};
Run Code Online (Sandbox Code Playgroud)