使用promise.then AngularJS在foreach之后仅显示一条消息

Question

大家好，我在AngularJS中使用REST在一个确认按钮中调用了这个函数。保存正常，问题出现在成功或错误消息中。如果循环执行成功，它应该只显示一条成功消息，或者多次显示任何错误的错误消息。我使用了一个isError标志来获取是否发生了错误，但不管我做什么，"if (isError == isError){“总是在循环结束之前执行。

 $scope.confirm = function () {
        var isError = false;
        var i=0;
        $scope.displayedmodalcollection.forEach(function(item) {
            i++;
            delete item.added;
            result = DataBase.update({
                id: item._id,
                endpoint: item._type
            }, item._source).$promise.then(function(response) {

            }, function(err) {
                isError = true;
                if (err.status === 500) {
                    ngToast.create({
                        className: 'warning',
                        content: String.format('Any message.', item._id)
                    });
                }
                else if (err.status === 404) {
                    ngToast.create({
                        className: 'danger',
                        content: '404 - other message'
                    });
                } else {
                    ngToast.create({
                        className: 'danger',
                        content: 'Error'
                    });
                }
            });
        });
        if (isError == false){

            ngToast.create({
                className: 'success',
                content: 'Success'
            });
        }
     };

有人对此有什么建议吗？谢谢

Answer 1

您可以使用$q.all()根据所有更新解析来显示成功的敬酒词

而不是：

$scope.displayedmodalcollection.forEach(function(item) {

做一些事情，比如

// map array of update promises
var updatePromises = $scope.displayedmodalcollection.map(function(item){
   // return the promise
   return DataBase.update({...}).$promise.then(function(response) {
               // success code
            }, function(err) {
               // error code
            });    
});    

$q.all(updatePromises).then(function(){
      // all promises were resolved
      ngToast.create({
                className: 'success',
                content: 'Success'
      });
});

记得在控制器中注入$q

Answer 2

我不确定您希望如何处理成功的更新和错误，但这应该会让您走上正确的道路：

$scope.confirm = function() {
    var successes = 0;
    var errors = 0;
    $scope.displayedmodalcollection.forEach(function(item) {
        delete item.added;
        result = DataBase.update({
            id: item._id,
            endpoint: item._type
        }, item._source).$promise.then(function(response) {
            successes++;
            checkStatus(successes, errors);
        }, function(err) {
            errors++;
            checkStatus(successes, errors);
            if (err.status === 500) {
                ngToast.create({
                    className: 'warning',
                    content: String.format('Any message.', item._id)
                });
            } else if (err.status === 404) {
                ngToast.create({
                    className: 'danger',
                    content: '404 - other message'
                });
            } else {
                ngToast.create({
                    className: 'danger',
                    content: 'Error'
                });
            }
        });
    });
};

function checkStatus(successes, errors) {
    var isCompleted = (successes + errors) == $scope.displayedmodalcollection.length;
    var notAllFailed = successes > 0;
    if (isCompleted && notAllFailed) {
        handleSuccessToast();
    }
}

function handleSuccessToast() {
    ngToast.create({
        className: 'success',
        content: 'Success'
    });
}

Answer 3

问题是，isError == false分支中的成功逻辑在所有DB调用完成之前执行。因此，它可能会在错误实际发生之前运行，因此该标志为false，并跟随分支。

发生这种情况是因为DB逻辑返回了promises。Promise不会阻止其余代码的执行--它们只是将'then‘回调中包含的逻辑推迟到数据库调用实际完成为止。因此，如果您的集合中有5个项目，则可以在其中任何一个项目实际完成之前启动所有5个项目的DB调用。关键是，您需要让您的成功逻辑等待，直到您知道所有DB承诺都已解决，并且所有调用都已完成。有关promises的更多信息，请参阅this Promise guide。

以下是一个示例，说明如何编写逻辑代码，以便在检查是否发生任何错误之前等待所有承诺得到解决：

var doneCount = 0;
var isError = false;
something.foreach(item) {
    somedblogic(item).$promise.then(function (response) {
        if (++doneCount === something.length && !isError) {
            //-- success logic here - runs one time after all db calls complete
        }
    },function (err) {
        doneCount++;
        isError = true;
        //-- rest of error logic here - runs once for each error returned
    });
}