How to append the given value in array in angular js

Question

JSFiddle

This is my save function i need to save as array in localstorage .Below code is showing what have tried ?? How can i solve this ? Where im doing mistake same value is appending in all arrays

Can anybody helps to over come this issue ?

$scope.savealbum = function() {

            var AlbumTitle = $("#AlbumTitle").val(); // 345
            var AlbumDescription = $("#AlbumDescription").val(); // 345
            var ImageName = $("#ImageName").val(); // 345
            var youtube1 = $scope.youtubelink1; // 345
            var youtube2 = $scope.youtubelink2; // 345
            var videocomment1 = $scope.videocomment1; // 345
            var videocomment2 = $scope.videocomment2; // 345
            var imagearray = $scope.imagearray; // 345


             var Album = {
                 album_desc: AlbumDescription,
                 id: 1,
                 album_title: AlbumTitle,                
                 ImageName: ImageName,
                 youtube1: youtube1,
                 youtube2: youtube2,
                 videocomment1: videocomment1,
                 videocomment2: videocomment2,
                 album_pics: []
             };



             // if (JSON.parse(localStorage.getItem('album')!="")) {
             var newPics = {
                 "media_type": imagearray['_file']['type'],
                 "last_modified_date": imagearray['_file']['lastModified'],
                 "thumnail_pic_loc": imagearray['_file']['name'],
                 "large_pic_loc": imagearray['_file']['name'],
                 "filter_type": imagearray['_file']['type'],
                 "pic_id": "d5bd"
             };

             Album.album_pics.push(newPics);
             // }

            $scope.albarr = [];
            $scope.albarr.push(Album);

            if (!JSON.parse(localStorage.getItem('album'))) {
                localStorage.setItem('album', JSON.stringify($scope.albarr));               
            } else {

                $scope.getalb=JSON.parse(localStorage.getItem('album'));
                for(irf in $scope.getalb) {
                    console.log('$scope.getalb');
                    console.log($scope.getalb[irf]);


                        $scope.album.album_desc = AlbumDescription;
                         //$scope.album.id= val['id']+1;
                        $scope.album.album_title= AlbumTitle;                
                         $scope.album.ImageName= ImageName;
                         $scope.album.youtube1= youtube1;
                         $scope.album.youtube2= youtube2;
                         $scope.album.videocomment1= videocomment1;
                         $scope.album.videocomment2= videocomment2;                      
                         $scope.album.album_pics= [{
                             "media_type": imagearray['_file']['type'],
                             "last_modified_date": imagearray['_file']['lastModified'],
                             "thumnail_pic_loc": imagearray['_file']['name'],
                             "large_pic_loc": imagearray['_file']['name'],
                             "filter_type": imagearray['_file']['type'],
                             "pic_id": "d5bd"
                         }];


                    $scope.getalb[irf]=$scope.album;
                    $scope.albarr.push($scope.getalb[irf]);
                }
                console.log($scope.albarr);
            localStorage.setItem('album', JSON.stringify($scope.albarr));
            //$route.reload();


            }


        }

Result now

[{
    "album_desc": "test2",
    "id": 1,
    "album_title": "Test1",
    "ImageName": "Penguins.jpg",
    "album_pics": [{
        "media_type": "image/jpeg",
        "last_modified_date": 1247549551000,
        "thumnail_pic_loc": "Penguins.jpg",
        "large_pic_loc": "Penguins.jpg",
        "filter_type": "image/jpeg",
        "pic_id": "d5bd"
    }]
}, {
    "album_title": "Test1",
    "album_desc": "test2",
    "ImageName": "Penguins.jpg",
    "album_pics": [{
        "media_type": "image/jpeg",
        "last_modified_date": 1247549551000,
        "thumnail_pic_loc": "Penguins.jpg",
        "large_pic_loc": "Penguins.jpg",
        "filter_type": "image/jpeg",
        "pic_id": "d5bd"
    }]
}]

My Expected Output

    [{
    "album_desc": "test1",
    "id": 1,
    "album_title": "Test1",
    "ImageName": "Light.jpg",
    "album_pics": [{
        "media_type": "image/jpeg",
        "last_modified_date": 1247549551000,
        "thumnail_pic_loc": "Light.jpg",
        "large_pic_loc": "Light.jpg",
        "filter_type": "image/jpeg",
        "pic_id": "d5bd"
    }]
}, {
    "album_title": "Test1",
    "album_desc": "test2",
    "ImageName": "Penguins.jpg",
    "album_pics": [{
        "media_type": "image/jpeg",
        "last_modified_date": 1247549551000,
        "thumnail_pic_loc": "Penguins.jpg",
        "large_pic_loc": "Penguins.jpg",
        "filter_type": "image/jpeg",
        "pic_id": "d5bd"
    }]
}]

Answer 1

If I understand your issue, you just want to append a new album in your localStorage array everytime you click on your form ? And your code is currently storing everytime the same album.

Your code is really complicated for this simple action ! I don't understand the aim your "for" loop ?

For me, here is the solution :

$scope.getalb = JSON.parse(localStorage.getItem('album'));

if (!JSON.parse($scope.getalb)) {
  localStorage.setItem('album', JSON.stringify($scope.albarr));
} else {
  $scope.getalb.push(Album);
  localStorage.setItem('album', JSON.stringify($scope.getalb));
}