Javascript AngularJS函数未按预期运行

Question

我的angularjs中有以下代码

 $scope.uploadImage = function(imageURI, fileName) {

    upload(imageURI, fileName)
    console.log("AFTER CALL upload");


    function upload(imageURI, fileName) {

       $ionicPlatform.ready(function() {
        console.log(FileTransfer);
      });

      console.log("in upload to s3")
      var deferred = $q.defer(),
        options = new FileUploadOptions();
        console.log("before options")
        options.fileKey = "file";
        options.fileName = fileName;
        options.mimeType = "image/jpeg";
        options.chunkedMode = false;
        options.params = {
            "key": fileName,
            "AWSAccessKeyId": awsKey,
            "acl": acl,
            "policy": policyBase64,
            "signature": signature,
            "Content-Type": "image/jpeg"
        };

        console.log(s3URI)
        console.log(imageURI)

        var ft = new FileTransfer();
        ft.upload(imageURI, s3URI,
          function (e) {
            console.log("done done")
            //push url here 
            // console.log(s3URI)
            // console.log(fileName)
            // $scope.finalimagelist.push(s3URI+fileName);
            // console.log($scope.finalimagelist)
            // console.log(JSON.stringify(e))
            //   deferred.resolve(e); 
            //   console.log("IN upload");

          },
          function (e) {
            deferred.reject(e);
          }, 
        options);
            console.log("ON upload");
            console.log(JSON.stringify($scope.finalimagelist));
            return deferred.promise;

  }
}

这段代码的问题是这些

console.log("ON upload");
console.log(JSON.stringify($scope.finalimagelist));
return deferred.promise;

在ft.Upload()执行之前被调用。 我希望ft.Upload()在其余部分继续之前先执行。

我在这里做错了什么？

任何帮助将不胜感激

Answer 1

您需要等待promise对象解决。 使用setTimeout模拟文件传输的简单plunkr示例： http ://plnkr.co/edit/vVkiI3KjeWgiUvCubUmQ

 upload(imageURI, fileName).then(function(result){
     console.log("AFTER CALL upload");
 });

也可以在这里解决诺言：

function (e) {
            console.log("done done")
            //push url here 
            // console.log(s3URI)
            // console.log(fileName)
            // $scope.finalimagelist.push(s3URI+fileName);
            // console.log($scope.finalimagelist)
            // console.log(JSON.stringify(e))
            //   deferred.resolve(e); 
            //   console.log("IN upload");
            deferred.resolve();
          },

因此，我注意到您起初并不是在等待诺言。 您只是在执行返回诺言的函数中执行代码。 如果您希望该代码在执行ft.ft.upload之后执行，则需要将其放入回调中。

$scope.uploadImage = function(imageURI, fileName) {

    upload(imageURI, fileName)
    console.log("AFTER CALL upload");


    function upload(imageURI, fileName) {

       $ionicPlatform.ready(function() {
        console.log(FileTransfer);
      });

      console.log("in upload to s3")
      var deferred = $q.defer(),
        options = new FileUploadOptions();
        console.log("before options")
        options.fileKey = "file";
        options.fileName = fileName;
        options.mimeType = "image/jpeg";
        options.chunkedMode = false;
        options.params = {
            "key": fileName,
            "AWSAccessKeyId": awsKey,
            "acl": acl,
            "policy": policyBase64,
            "signature": signature,
            "Content-Type": "image/jpeg"
        };

        console.log(s3URI)
        console.log(imageURI)

        var ft = new FileTransfer();
        ft.upload(imageURI, s3URI,
          function (e) {
            console.log("done done")
            //push url here 
            // console.log(s3URI)
            // console.log(fileName)
            // $scope.finalimagelist.push(s3URI+fileName);
            // console.log($scope.finalimagelist)
            // console.log(JSON.stringify(e))
            //   deferred.resolve(e); 
            //   console.log("IN upload");

            //PUT THIS STUFF HERE
            console.log("ON upload");
            console.log(JSON.stringify($scope.finalimagelist));
            deferred.resolve();
          },
          function (e) {
            deferred.reject(e);
          }, 
        options);

            return deferred.promise;

  }
}

Answer 2

根据您的评论，如果您得到回应，则可以检查是否符合条件，然后运行"ON Upload"行，

范例程式码

var ftUpload = ft.upload(imageURI, s3URI,
          function (e) {
            console.log("done done")
            //push url here 
            // console.log(s3URI)
            // console.log(fileName)
            // $scope.finalimagelist.push(s3URI+fileName);
            // console.log($scope.finalimagelist)
            // console.log(JSON.stringify(e))
            //   deferred.resolve(e); 
            //   console.log("IN upload");

          },
          function (e) {
            deferred.reject(e);
          }, 
        options);

if ( ftUpload == YOUR_STATUS_CODE ) {
       console.log("ON upload");
       console.log(JSON.stringify($scope.finalimagelist));
       return deferred.promise;
}

根据您的代码更改条件。