# Can I use $localstorage like an object array?

**URL:** <https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396>\
**Category:** ionic-v1\
**Created:** [July 28, 2015, 6:09pm UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396 "2015-07-28T18:09:10Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![nypraise](https://avatars.discourse-cdn.com/v4/letter/n/4da419/32.png) [@nypraise](https://forum.ionicframework.com/u/nypraise)\
**Post date:** [July 28, 2015, 6:09pm UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/1 "2015-07-28T18:09:10Z")

</div>

Hi,

Can I use $localstorage like I do an object array? Can I do ng-repeat on it to list up all the stored objects? And how would I go about to delete from local storage?

And lastly;

Is $localstorage already in Ionic or do I have to manually add it? I was a little confused by the explanation from this site: [http://learn.ionicframework.com/formulas/localstorage/](http://learn.ionicframework.com/formulas/localstorage/)

---

<div class="post-metadata">

**Author:** ![Praveena](https://avatars.discourse-cdn.com/v4/letter/p/49beb7/32.png) [@Praveena](https://forum.ionicframework.com/u/Praveena)\
**Post date:** [July 28, 2015, 6:57pm UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/2 "2015-07-28T18:57:42Z")

</div>

It doesn’t come by default with Ionic you can install $localstorage using any one of the below commands  
bower install ngstorage  
npm install ngstorage

Please follow this link [https://github.com/gsklee/ngStorage](https://github.com/gsklee/ngStorage) it has how to store and delete the object to localstorage .

For example if you are saving name to localstorage the syntax is  
$[localstorage.name](http://localstorage.name) = “SampleName”

Inorder to delete the name from localstorage user  
delete $[localstorage.name](http://localstorage.name)

---

<div class="post-metadata">

**Author:** ![nypraise](https://avatars.discourse-cdn.com/v4/letter/n/4da419/32.png) [@nypraise](https://forum.ionicframework.com/u/nypraise)\
**Post date:** [July 28, 2015, 6:59pm UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/3 "2015-07-28T18:59:39Z")

</div>

Awesome! And how about using it as a object array? Will I be able to run a ng-repeat on the local storage?

---

<div class="post-metadata">

**Author:** ![Praveena](https://avatars.discourse-cdn.com/v4/letter/p/49beb7/32.png) [@Praveena](https://forum.ionicframework.com/u/Praveena)\
**Post date:** [July 28, 2015, 7:04pm UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/4 "2015-07-28T19:04:38Z")

</div>

Bind the localstorage object to a $scope variable and use it to bind with ng-repeat

---

<div class="post-metadata">

**Author:** ![nypraise](https://avatars.discourse-cdn.com/v4/letter/n/4da419/32.png) [@nypraise](https://forum.ionicframework.com/u/nypraise)\
**Post date:** [August 3, 2015, 9:17am UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/5 "2015-08-03T09:17:47Z")

</div>

@Praveena It does not seem to store the value when I refresh the browser or restart Ionic View on my phone. I followed the instructions from GitHub ([https://github.com/gsklee/ngStorage](https://github.com/gsklee/ngStorage)). Am I missing something?

This is what I do:  
From the controller:

```
$scope.$storage = $localStorage;
//This function collect data from an API and stores it in the object I want to have stored.
//myPopup function is what will have the most relevant information I think
$scope.showPopup = function() {

    var i = 0;
    //Pictures array stores 10 hits with URL of images
    $scope.pictures = [];
    //newitem is the new object pushed to items array
    $scope.newitem = {}

    $scope.getPic = function(name) {

        $http.get('https://www.googleapis.com/customsearch/v1?key=AIzaSyDKzJO_2-a82Jrn0sA2oSnDgHORcJegCAA&cx=011061616694035020478:dvpxju__yje&searchType=image&lr=lang_no&q=' + name).then(function(resp) {
            console.log('Success', resp.data.items);
            $scope.pictures = resp.data.items;
            $scope.newitem.pic = resp.data.items[0].image.thumbnailLink;
        })

        $scope.changePic = function() {

            if (i == 10) {

                i = 0;

            } else {
                i++;
            }
            $scope.newitem.pic = $scope.pictures[i].image.thumbnailLink;

        }

    }

    var myPopup = $ionicPopup.show({
        template: '<form ng-submit="getPic(newitem.name)"><input type="text" placeholder="Item name" ng-model="newitem.name" ng-blur="getPic(newitem.name)"></br><input type="number" placeholder="Amount" ng-model="newitem.amount"></br><img alt="Press me!" src="{{newitem.pic}}" style="display:block;width:100px;height:100px;margin-left:auto;margin-right:auto;" ng-click="changePic()"></form>',
        title: 'Add new item to list',
        subTitle: 'Tip:Tap the image to change it',
        scope: $scope,
        buttons: [{
            text: 'Cancel'
        }, {
            text: '<b>Save</b>',
            type: 'button-positive',
            onTap: function(e) {
                $scope.$storage.storedItems.push($scope.newitem);
            }
        }]
    });
}
//This is where the object array is instansiated.
$scope.$storage.storedItems = [

];

```

From the html:

```
<ion-list show-delete="data.showDelete">
        <ion-item class="item item-thumbnail-left item-remove-animate" ng-repeat="item in $storage.storedItems" href="#">
            <ion-delete-button class="ion-minus-circled" ng-click="$storage.storedItems.splice($index, 1)">
            </ion-delete-button>
            <img src="{{item.pic}}">
            <b><h2>{{item.name}}</h2></b>
            <b><h2>{{item.amount}}</h2></b>
            <button id="addButton" class="button button-icon icon ion-ios-plus-outline verticAlign" ng-click="moveToItems(item)">
            </button>
        </ion-item>
```

---

<div class="post-metadata">

**Author:** ![nypraise](https://avatars.discourse-cdn.com/v4/letter/n/4da419/32.png) [@nypraise](https://forum.ionicframework.com/u/nypraise)\
**Post date:** [August 4, 2015, 9:23am UTC](https://forum.ionicframework.com/t/can-i-use-localstorage-like-an-object-array/29396/6 "2015-08-04T09:23:51Z")

</div>

I solved it. It was the : $scope.$storage.storedItems = []; that ended up resetting the local storage. I just removed it and it worked. 🙂
