Html 从url获取图像文件对象

我正在制作一个django angularjs网络应用程序。 用户可以选择上传文件。

我想向用户提供一些要上载的示例图像。
因此，这就像示例图像将由服务器发送到客户端，如果客户端选择它们作为新上载，则再次发送回服务器。

angularjs指令：

angular.module('users').directive('fileModel', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
    var model = $parse(attrs.fileModel);
    var modelSetter = model.assign;

    element.bind('change', function(){
        scope.$apply(function(){
            modelSetter(scope, element[0].files[0]);
        });
    });
}
};
}]);

我的html：

<input type="file" file-model="myFile"/><br><br>
<button ng-click="uploadFile()">Upload</button>

使用上面的代码，用户可以从电脑中选择图像并上传。

现在，如果我们有服务器发送的示例图像的url。 如何对角度控制器进行编码，以便从这些URL获取其文件对象的图像？
比如$scope.myFile=getImageFileObjectFromUrl（url）

谢谢你的帮助

$http.get("image_url", {responseType: "arraybuffer"}).success((data) => {
    fd.append('file', data);
});

---

一般来说，当您获取图像url时，只需以arraybuffer的形式请求url，然后只需将blob对象传递给formdata。

将给定url中的图像转换为文件对象：

$http.get(url,{responseType: "blob"}).success((data) => {
  var file = new File([data], "sample.jpg");
  $scope.sampleFile=file;
});

这也可能有帮助

  $http.get(url.path, {responseType: "blob"}).then((res) => {
   let fileUrl = (window.URL || window.webkitURL).createObjectURL(res.data);
   resolve({file: fileUrl, type: url.type, name: url.name});
  });

---

不工作。。。数据始终为空arraybuffer。虽然我在删除响应类型时可以看到jpeg数据。您使用哪种版本的angular？您必须使用XHR2才能使arraybuffer正常工作，所以可能只需要使用原始的XMLHttpRequest 2而不是angular的$http.Hi，您知道如何将此图像显示到HTML端吗？

  $http.get(url.path, {responseType: "blob"}).then((res) => {
   let fileUrl = (window.URL || window.webkitURL).createObjectURL(res.data);
   resolve({file: fileUrl, type: url.type, name: url.name});
  });