将fileList对象从页1传递到页2.html

我有一个文件输入可以选择多个文件。我知道如何在同一页面上显示这些图像的预览。但是，在我的情况下，我想要选择第1页上的图像并将此文件列表发送到第2页以在上传之前显示预览。我认为这会很简单，但力量可以让它工作。将fileList对象从页1传递到页2.html

我查看了本地存储，发现File APIs无法序列化，因此尝试使用第1页上的FileReader解决其他问题，并将读取器结果设置为本地存储..我不想使用filereader方法，因为文件和大小的数量可能真的很大。

任何想法，我怎么可以将文件选择后页1的fileList对象通过第2页？我不知道FileObjects如何在通常的方法中传递页面之间的数据... 谢谢！

来源

2014-02-21 Codedroid

我通过使用角度js服务解决了我的问题。

在任何人的情况下的代码的爱好：

HTML页面1上：

<input type="file" ng-model-instant id="fileToUpload" accept="image/*" 
        multiple onchange="angular.element(this).scope().setFiles(this);document.location.href = '/#/page2';"/>

services.js：

angular.module("fileservices", []) 
    .service('fileListService', function() { 
     var fileList = []; 

     return { 
      getFileList: function() { 
       return fileList; 
      }, 
      setFileList: function(value) { 
       fileList = value; 
      } 
     }; 
    });

page1Controller：

.controller("page1Ctrl", ["$scope","fileListService", function ($scope,fileListService) { 
     $scope.setFiles = function(element) { 
      var files = []; 
      // Turn the FileList object into an Array 
      for (var i = 0; i < element.files.length; i++) { 
       files.push(element.files[i]) 
      } 
      fileListService.setFileList(files); 
      var data = fileListService.getFileList(); 
     }; 
    }])

第2页控制器：

.controller("page2Ctrl", ["$scope","fileListService", function ($scope,fileListService) { 
     var data= fileListService.getFileList(); 
     $scope.getFiles = data; 
}])

希望它有帮助！

来源

2014-02-21 23:34:26 Codedroid

将fileList对象从页1传递到页2.html

回答

相关问题