Javascript AngularJS照片/文件上传

Javascript AngularJS照片/文件上传,javascript,angularjs,Javascript,Angularjs,除了FF之外,上传文件和照片似乎在其他浏览器上也能正常工作。它似乎在表单中的某个地方失败了。但是我不明白为什么它在Chrome和IE上工作,而不是FF 有人能解释一下这个吗 控制器: $scope.uploadProfilePhoto = function() { $timeout(function(){ var form = new FormData(); form.append("fileName", v

除了FF之外,上传文件和照片似乎在其他浏览器上也能正常工作。它似乎在表单中的某个地方失败了。但是我不明白为什么它在Chrome和IE上工作,而不是FF

有人能解释一下这个吗

控制器:

$scope.uploadProfilePhoto = function() {
            $timeout(function(){
                var form = new FormData();
                form.append("fileName", vm.profilePhoto.fileName);
                form.append('file', vm.profilePhoto.file);
                ProfileService.uploadProfilePicture(form)
                    .then(function(response){
                        vm.ProfilePictureUrl = api.getQualifiedUrl('image/' + response.data.ImageId);
                    })
            });
        }
输入:

<label for="profilePhoto" class="photo-upd" >
  <img data-ng-src="{{vm.ProfilePictureUrl}}" id="profile-picture_image" alt="Candidate profile photo" onchange="angular.element(this).scope().uploadProfilePhoto(this)" class="img-responsive">                        
  <span><i class="fa fa-upload"></i> Upload Photo</span>
</label>
<input id="profilePhoto" type="file" name="profilePhoto" valid-file data-oh-file fileread="vm.profilePhoto.file" filename="vm.profilePhoto.fileName" class="hidden"onchange="angular.element(this).scope().uploadProfilePhoto(this)">

你不应该在上传功能中使用$scope.vm吗?

你不应该在上传功能中使用$scope.vm吗?

我刚刚注意到,
vm
对象必须是对象/控制器的
self
this

您还需要声明
vm.profilePhoto
对象:

JS: 示例如下:


我只是注意到
vm
对象必须是对象/控制器的
self
this

您还需要声明
vm.profilePhoto
对象:

JS: 示例如下:


这应该是一个注释而不是答案,不,我将$scope替换为vm。当我在FF调试器上运行它时,它似乎工作正常,因为我得到了文件名和路径。很抱歉,我没有足够高的代表发表评论。如果vm是作用域,为什么要同时使用这两个?。另外,如果vm是scope,您不应该在htmlhis中包含vm。这应该是一个注释,而不是一个答案,不,我将$scope替换为vm。当我在FF调试器上运行它时,它似乎工作正常,因为我得到了文件名和路径。很抱歉,我没有足够高的代表发表评论。如果vm是作用域,为什么要同时使用这两个?。另外,如果vm是作用域,那么在HTML中不应该有vm,这似乎就是答案。我放了一个空的vm.profilePhoto,似乎可以正常工作,但会做进一步的调试。似乎在应用onchange之前,它必须等待文件完全上传,有没有办法做到不超时延迟?延迟似乎可以,但不确定这是否是最好的方法。是的,我将毫不延迟地发布一个示例。给我30分钟。之所以会有延迟,是因为有一个异步调用要上传文件,所以它必须等待,那么除了$timeout和$interval之外,最好使用什么函数/服务呢?或者是否有其他方法等待异步?您可以添加回调函数或直接使用。如果您使用$httpYes,这似乎是答案。我放了一个空的vm.profilePhoto,似乎可以正常工作,但会做进一步的调试。似乎在应用onchange之前,它必须等待文件完全上传,有没有办法做到不超时延迟?延迟似乎可以,但不确定这是否是最好的方法。是的,我将毫不延迟地发布一个示例。给我30分钟。之所以会有延迟,是因为有一个异步调用要上传文件,所以它必须等待,那么除了$timeout和$interval之外,最好使用什么函数/服务呢?或者是否有其他方法来等待异步?您可以添加回调函数或直接使用。如果您使用的是$http
vm.profilePhoto is undefined
Profile/$scope.uploadProfilePhoto/
var vm = this;
vm.profilePhoto = {};
var app = angular.module("turingApp", []);

app.controller("turingController", ["$scope","$timeout", function($scope,$timeout) {
    var vm = this;
    vm.profilePhoto = {};

  $scope.uploadProfilePhoto = function() {
    $timeout(function() {
      var form = new FormData();
      form.append("fileName", vm.profilePhoto.fileName);
      form.append('file', vm.profilePhoto.file);
      ProfileService.uploadProfilePicture(form)
        .then(function(response) {
          vm.ProfilePictureUrl = api.getQualifiedUrl('image/' + response.data.ImageId);
        })
    });
  };

}]);