Javascript AngularJS函数在预期时不会运行

时间:2015-05-27 05:45:15

标签: javascript angularjs

我在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()在其余的继续之前先执行。

我在这里做错了什么?

非常感谢任何帮助

2 个答案:

答案 0 :(得分: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();
          },

所以我注意到你并没有试图在第一时间等待承诺。您只是在返回promise的函数中执行代码。如果您希望该代码在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;

  }
}

答案 1 :(得分:0)

根据您的评论,如果您收到回复,可以查看条件,然后运行"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;
}

根据您的代码更改条件。