Question

我是angularjs的新手，并尝试将数据从http请求函数分配给$ scope变量。但是由于异步，这行代码 console.log（$ scope.field_result_var） 将在请求完成之前执行

app.controller('my_control', function($scope, $http) {

        $scope.field_result_var  ='';       

        $scope.check_field_http = function() {
            $http({
                    method: 'GET',
                    url: 'aaa.php',
                    params : {field:$scope.field_data}
                    }).then(function successCallback(response) {
                            $scope.field_result_var  = response.data;

                     }, function errorCallback(response) {

                     });
        };


        $scope.check_field = function() {
            $scope.check_field_http ();

            //below is code need to execute after get the data like
            console.log($scope.field_result_var  );     
        };


});

我试图根据AngularJS http return value中的答案使用回调函数，但我可能会错误地实现回调函数，因此 console.log（$ scope.field_result_var） 仍然在请求完成之前执行

app.controller('my_control', function($scope, $http) {

        $scope.field_result_var  ='';       

        $scope.check_field_http = function() {
            $http({
                    method: 'GET',
                    url: 'aaa.php',
                    params : {field:$scope.field_data}
                    }).then(function successCallback(response) {
                            myCallbackFunction(response);

                     }, function errorCallback(response) {

                     });
        };


        $scope.check_field = function() {
            $scope.check_field_http ();

            //below is code need to execute after get the data like
            console.log($scope.field_result_var);       
        };

       function myCallbackFunction(response_param) {
            $scope.field_result_var  = response_param.data; 
        }
});

对不起，我在这里提出的问题很少，有些可能是angularjs的一般概念：

1）我为回调实现所犯的错误是什么，以确保在$ http请求成功后执行console.log？

2）如果我定义了回调函数，如何为我的情况调用它？

 $scope.myCallbackFunction = function (response_param) {
            $scope.field_result_var  = response_param.data; 
        }

3）

之间有什么区别

  $scope.myCallbackFunction = function (response_param) {
            $scope.field_result_var  = response_param.data; 
        }

和

 function myCallbackFunction(response_param) {
            $scope.field_result_var  = response_param.data; 
        }

在angularjs？

4）在搜索解决方案时，我看到人们在 myApp.factory 中创建了http请求，例如How to wait till the response comes from the $http request, in angularjs?

使用 myApp.factory 创建函数与使用 $ scope.function_name = function（）创建函数之间有什么区别

Answer 1

你在这个问题上问了很多事情。让我们从最后开始，然后向后工作，因为你在底部询问了高级问题。

使用myApp.factory创建函数有什么区别 vs使用$ scope.function_name = function（）
创建一个函数

在AngularJS中，有一个 services 的概念，它是可注入的代码块，用于封装某些功能。为了使事情更加混乱，有一些特定类型的服务具有自己的语法。您可以使用 .factory（）,. provider（），或 .service（），但它们几乎都提供了作为放置业务逻辑的地方的相同目的否则你可能会把它放在控制器中（而在Angular 2中它们都只是在“服务”中合并）。

4）在搜索解决方案时，我看到人们在myApp.factory中创建了http请求，比如如何等待响应来自$ http请求，在angularjs中？

主要组件（或控制器）的责任应该是保存数据，以便视图可以显示它。调用一个http请求不应该在你的控制器中，因为它变得庞大而臃肿。 作为一般经验法则：尽可能保持控制器的利用率，利用提供一项主要服务的“帮助”服务。

3）
之间有什么区别
$ scope.myCallbackFunction = function（response_param）{               $ scope.field_result_var = response_param.data;           和

function myCallbackFunction（response_param）{               $ scope.field_result_var = response_param.data;           在angularjs？

您在这里询问的概念是anonymous functions，对于AngularJS甚至JavaScript来说都不是唯一的。匿名函数没有名称。这些非常在JavaScript开发中很常见，特别是对于异步操作的回调。对于解释代码的计算机没有区别，但匿名函数使用较少的字符，较少的行，并且您不需要跳转来查找回调函数。 作为一般经验法则：如果您实际上从未按名称调用该函数，请考虑将其设为匿名。

2）如果我定义了回调函数，如何为我调用它   情况？

$ scope.myCallbackFunction = function（response_param）{               $ scope.field_result_var = response_param.data;           }

您已将该函数定义为名为 $ scope.myCallbackFunction 的变量的值。所以你可以这样做：

    $scope.check_field_http = function() {
        $http({
            method: 'GET',
            url: 'aaa.php',
            params : {field:$scope.field_data}
            }).then(
                 $scope.myCallbackFunction, 
                 $scope.myCallbackFunction
            );
        };

现在，回答你原来的问题，“这里的错误是什么？”。似乎console.log语句出现在$ scope.check_field函数内部。 JavaScript中的异步请求为非阻止，因此 $ scope.check_field_http 将会运行，并发送其请求。然后解释器将继续逐步执行代码，在发送请求后立即执行日志语句，但不等待响应返回。如果您希望在请求返回后发生console.log语句，则应将其移动到名为 myCallbackFunction 的函数体中。

Answer 2

也许你应该在你的http请求中使用.success而不是.then，你也可以使用.error来处理你的http请求中的错误

类似这样的事情

 $http({
            url: url,
            method: method,          
        }).success(function (data, status, headers, config) {
          //your success logic here
        })
        .error(function (data, status, headers, config) {
            //your error logic here
        })
        .finally(function () {
            //your finally logic here (optional)
        });

回调函数$ http request angularjs

2 个答案: