javascript - Angular 异步函数不会等到完成后再继续

标签 javascript angularjs

<分区>

我有一个上传功能,可以循环选择文件并将它们添加到服务器文件系统。

上传功能:

$scope.uploadImages = function () {
        for (var i = 0; i < $scope.imageModels.length; i++) {
            var $file = $scope.imageModels[i].file;
            (function (index) {
                $upload
                    .upload({
                        url: "/api/upload/",
                        method: "POST",
                        data: { type: 'img', object: 'ship' },
                        file: $file
                    })
                    .progress(function (evt) {
                        $scope.imageProgress[index] = parseInt(100.0 * evt.loaded / evt.total);
                    })
                    .success(function (data) {
                        $scope.imageProgressbar[index] = 'success';

                        // Add returned file data to model
                        $scope.imageModels[index].Path = data.Path;
                        $scope.imageModels[index].FileType = data.FileType;
                        $scope.imageModels[index].FileSize = $scope.imageModels[index].file.size;

                        var image = {
                            Path: data.Path,
                            Description: $scope.imageModels[index].Description,
                            Photographer: $scope.imageModels[index].Photographer
                        };
                        $scope.images.push(image);
                    })
                    .error(function (data) {
                        $scope.imageProgressbar[index] = 'danger';
                        $scope.imageProgress[index] = 'Upload failed';

                        alert("error: " + data.ExceptionMessage);
                    });
            })(i);
        }
        return $scope.images;
    }
};

如果我单独调用它,它工作得很好,但是当我将它与我的其他函数放在一起时,它似乎没有完成:

 $scope.create = function () {
    $scope.ship = {};

    // This function is asynchronous
    $scope.ship.Images = $scope.uploadImages();

    // Here $scope.ship don't contain any Images
    angular.extend($scope.ship, $scope.shipDetails);

    shipFactory.createShip($scope.ship).success(successPostCallback).error(errorCallback);
};

$scope.ship 不包含图像,当我调试时它开始上传它们,但不等待它完成并只执行下一行代码。

我怎样才能让它工作,以便确保 $scope.uploadImages 函数在它继续之前完成?

最佳答案

为了确保您的功能已完成,您需要使用 promises .

这是一个非常有用的视频教程,解释了如何使用它们:

https://egghead.io/lessons/angularjs-promises

关于javascript - Angular 异步函数不会等到完成后再继续,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21713215/

相关文章:

javascript - 使用 Angular Promise 进行 Jasmine 测试无法使用 TypeScript 进行解析

android - Ionic/Cordova : How to force app to refresh on start, 即使它在后台?

javascript - GET 请求返回时 $q 不更新

javascript - 处理未找到 ng-include 的最佳方法是什么?

javascript - 添加绝对超链接 URL

javascript - 鼠标悬停不适用于第一次悬停 Angular 5

javascript - 简单 for 循环出现意外标记错误?

jquery-ui - 将 Umbraco 属性编辑器输入设置为 jQueryUI Datepicker

javascript - HTML 单选按钮 : hide bullets

javascript - jquery 窗口宽度在某些断点处不起作用