问题与异步函数和JavaScript变量的作用域 [英] Issue with asynchronous function and scope of javascript variable

问题描述

我有以下的code调用REST的Web服务。 Web服务返回布尔。

  checkCurrentPassword：功能（passwordInfo）{
        VAR有效= FALSE;
        $ http.post（'/ API / preference /密码/检查'，passwordInfo）
            .success（功能（数据）{
                有效=数据;
            }）;
        返回有效的;
    }
 

麻烦的是，由当时的 checkCurrentPassword 收益有效还是假因为Ajax调用并没有因为它的异步特性完成。

我不知道如何确保有效变量正确地分配从服务器返回的值。

任何人都可以请帮助？

编辑1

使用回调，看来我只能驱逐问题到控制器层以下...请参见：

从角服务：

  checkCurrentPassword：功能（passwordInfo，回调）{
              返回$ http.post（'/ API / preference /密码/检查'，passwordInfo）
                    .success（功能（数据）{
                        回调（数据）;
                    }）;
            }
 

从角控制器：

  $ scope.updatePassword =功能（）{
            如果（$ scope.updatePasswordForm $有效）{                VAR有效= FALSE;                passwordService.checkCurrentPassword（{plainPassword：$ scope.passwordInfo.currentPassword}，功能（数据，状态）{
                    有效=数据;
                }）;                的console.log（有效）; //始终为假                passwordService.updatePassword（$ scope.passwordInfo，功能（数据，状态）{
                    的console.log（'更新密码成功'）;
                    $ state.go（仪表盘）;
                }）;
            }
        };
 

编辑2 ：这里是我如何改写控制器：

  $ scope.updatePassword =功能（）{
            如果（$ scope.updatePasswordForm $有效）{
                passwordService.checkCurrentPassword（{plainPassword：$ scope.passwordInfo.currentPassword}）。成功（功能（数据）{
                    如果（数据）{
                        passwordService.updatePassword（$ scope.passwordInfo，功能（数据，状态）{
                            的console.log（'更新密码成功'）;
                            $ state.go（仪表盘）;
                        }）;
                    }
                }）;
            }
        };
 

解决方案

您应该使用 angulars内置的$ q服务

您是职能将是这个样子。
（确保在顶部注入$ Q到code）

  checkCurrentPassword：功能（passwordInfo）{    变种推迟= $ q.defer（）;
    VAR有效= FALSE;    $ http.post（'/ API / preference /密码/检查'，passwordInfo）
        .success（功能（数据）{
            有效=数据;
            deferred.resolve（）;
        }）
        .error（功能（错误）{
            deferred.reject（）;
        }）;    返回deferred.promise;
 

};

I have the following code that calls an REST webservice. The web service returns a boolean.

    checkCurrentPassword: function (passwordInfo) {
        var valid = false;
        $http.post('/api/preference/password/check', passwordInfo)
            .success(function (data) {
                valid = data;
            });
        return valid;
    }

The trouble is that by the time the checkCurrentPassword returns valid is still false because the ajax call has not completed due to its asynchronous nature.

I am not sure how to make sure the valid variable is properly assigned the value returned from the server.

Can anyone please help?

edit 1:

Using a callback, It seems I am only deporting the problem to the controller layer... See below:

from angular service:

checkCurrentPassword: function (passwordInfo, callback) {
              return  $http.post('/api/preference/password/check', passwordInfo)
                    .success(function (data) {
                        callback(data);
                    });
            }

from angular controller:

 $scope.updatePassword = function () {
            if ($scope.updatePasswordForm.$valid) {

                var valid = false;

                passwordService.checkCurrentPassword({plainPassword: $scope.passwordInfo.currentPassword}, function(data, status){
                    valid = data;
                });

                console.log(valid);//always false

                passwordService.updatePassword($scope.passwordInfo, function (data, status) {
                    console.log('Updated password successfully');
                    $state.go('dashboard');
                });
            }
        };

edit 2: here is how I rewrote the controller:

$scope.updatePassword = function () {
            if ($scope.updatePasswordForm.$valid) {
                passwordService.checkCurrentPassword({plainPassword: $scope.passwordInfo.currentPassword}).success(function (data) {
                    if (data) {
                        passwordService.updatePassword($scope.passwordInfo, function (data, status) {
                            console.log('Updated password successfully');
                            $state.go('dashboard');
                        });
                    }
                });
            }
        };

解决方案

You should use angulars's built in $q service

You're function would look something like this. (make sure to inject $q into your code at the top)

checkCurrentPassword: function (passwordInfo) {

    var deferred = $q.defer();
    var valid = false;

    $http.post('/api/preference/password/check', passwordInfo)
        .success(function(data){
            valid = data;
            deferred.resolve();
        })
        .error(function(error){
            deferred.reject();
        });

    return deferred.promise;

};

这篇关于问题与异步函数和JavaScript变量的作用域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！