動態將數據添加到JSON

Question

所以我想做的是將圖片的dataUri存儲在我的本地存儲中。 我只使用javascript和angularJS。 目前沒有jQuery。

圖片是通過類型為“ file”的輸入（其ID為“ input_file_0 ”等）上傳的。

我可以將id和dataUri存儲在$ scope.files變量中。 因此，如果我說console.log($scope.files); 我得到這樣的輸出：

$ scope.files

< [input_file_0:File, input_file_1:File, ...]
  length:0
  < input_file_0:File
       lastModified: 1457515898145
       lastModifiedDate: Wed Mar 09 2016 10:31:38 GMT+0100 
       name: "name-of-picture.png"
       size: 206156
       src:  "data:image/png;base64,iVBORw0K..."
       type: "image/png"

  > input_file_1:File

controller.js

/*
 * stores $scope-values for longer reference in the localStorage
 * @returns {undefined}
 */
    $scope.storeDataInLocalStorage = function () {
        if (typeof (localStorage) !== 'undefined') {
            //storing file data
            var data = {};
            for (var i = 0; i <= $scope.files.length; i++) {
                data.push({ 'file_input_'+i : $scope.files['file_input_'+i].src}) ;
            }
            localStorage.setItem('files', JSON.stringify(data));
        }
        /* No localstorage support */
        else {
            alert("Sorry. Localstorage is not supported");
        }
    };

---

我想實現這樣的localStorage項：

localStorage.getItem('files') = 
{'input_file_0' : "data:image/png;base64,iVBORw0K...", 
 'input_file_1 : "data:image/png;base64,iVBORw0K..."}

但是設置密鑰只是行不通的。 獲得src屬性就可以了。 但是用變量作為鍵是行不通的。 它總是只用變量名代替它。

---

Answer 1

我自己嘗試解決了之前無法解決的問題，現在突然解決了。 也許已經在本地存儲了一些東西，但我沒有正確刪除它。

這次我沒有使用push，所以我的代碼如下所示：

controller.js

/*
 * stores $scope-values for longer reference in the localStorage
 * @returns {undefined}
 */
    $scope.storeDataInLocalStorage = function () {
        if (typeof (localStorage) !== 'undefined') {
            //storing file data
            var data = {};
            for (var i = 0; i <= $scope.files.length; i++) {

                data['input_file_'+i]= $scope.data['input_file_'+i].src;

            }
            localStorage.setItem('files', JSON.stringify(data));
        }
        /* No localstorage support */
        else {
            alert("Sorry. Localstorage is not supported");
        }
    };

還是有人知道如何使用array.push()嗎？

Answer 2

使用額外的對象在for循環中添加項目：

  var data = [];
  for (var i = 0; i <= $scope.files.length; i++) {
        var o = {};
        o[('file_input_' + i)] = $scope.files['file_input_'+i].src;
        data.push(o);
   }
  localStorage.setItem('files', JSON.stringify(data));