Javascript $http服务未在控制器angularjs内触发成功处理程序？

我正在开发AngularJS应用程序。在最初构建了基本应用程序之后，我将转向角度布线。我已经成功地实现了路由。我以前的页面中的数据使用

$routeParams

进入我正在发送的页面

在我的控制器内，我正在调用$http服务，并从

$routeParams

服务接收输入。我使用了所有REST API，并在chrome的网络选项卡中看到响应返回，但未调用http服务的成功处理程序。尝试调试，但从未到达断点

以下是我的路由配置：

var app = angular.module('mainApp',['ngRoute']); 
app.config(function($routeProvider){
    $routeProvider.when('/',{
        templateUrl:"main.html",
        controller:'CategoriesController'
    }).when('/imagedetails/:imageId',{
        templateUrl: 'imagedetails.html',
        controller:'ImageDetailsController'
    })
    .otherwise({redirectTo:'/'});

});

因此，我将

imageId

传递给ImageDetailsController，以从RESTAPI获取数据

这是我的控制器：

 var ImageDetailsController = function($scope, $http, $routeParams)
    {
        $scope.imageId = $routeParams.imageId;
        console.log("Print image id : " + $scope.imageId);
        $scope.image = {};
        $scope.params = $routeParams;

         var downloadImageRequest = {
                 method: 'GET',
                 url: '<my-rest-api-url>',
                 headers: {
                   'Content-Type': 'application/json' 
                 }
        };

        $http(downloadImageRequest).then(onImageSuccess, onImageFailure);

        var onImageSuccess = function(response){ // i have put debug inside this method but never reaches controller
            console.log(response  );
            $scope.image = response.data.results[0];
        };
        var onImageFailure = function(response){
            alert("Failed to load image please try again!!");
             console.log(response);
        };
    }

var-ImageDetailsController=function（$scope、$http、$routeParams）
{
$scope.imageId=$routeParams.imageId；
log（“打印图像id:+$scope.imageId”）；
$scope.image={}；
$scope.params=$routeParams；
var downloadImageRequest={
方法：“GET”，
url:“”，
标题：{
“内容类型”：“应用程序/json”
}
};
$http（downloadImageRequest）。然后（onImageSuccess，onImageFailure）；
var onImageSuccess=function（response）{//我已将调试放入此方法中，但从未到达控制器
控制台日志（响应）；
$scope.image=response.data.results[0]；
};
var onImageFailure=功能（响应）{
警报（“加载图像失败，请重试！！”；
控制台日志（响应）；
};
}

在ChromeDeveloper工具的网络选项卡中，响应是可见的，但位于我设置响应未触发的方法之上

---

请帮助

您应该首先定义变量，然后使用它们。定义变量不同于定义函数。因此，您可以：

    var onImageSuccess = function(response){
        console.log(response  );
        $scope.image = response.data.results[0];
    };

    var onImageFailure = function(response){
        alert("Failed to load image please try again!!");
         console.log(response);
    };

    $http(downloadImageRequest).then(onImageSuccess, onImageFailure);

也可以通过定义命名函数来实现：

    $http(downloadImageRequest).then(onImageSuccess, onImageFailure);

    function onImageSuccess(response){ // i have put debug inside this method but never reaches controller
        console.log(response  );
        $scope.image = response.data.results[0];
    }

    function onImageFailure(response){
        alert("Failed to load image please try again!!");
         console.log(response);
    }

---

您应该首先定义变量，然后使用它们。定义变量不同于定义函数。因此，您可以：

    var onImageSuccess = function(response){
        console.log(response  );
        $scope.image = response.data.results[0];
    };

    var onImageFailure = function(response){
        alert("Failed to load image please try again!!");
         console.log(response);
    };

    $http(downloadImageRequest).then(onImageSuccess, onImageFailure);

也可以通过定义命名函数来实现：

    $http(downloadImageRequest).then(onImageSuccess, onImageFailure);

    function onImageSuccess(response){ // i have put debug inside this method but never reaches controller
        console.log(response  );
        $scope.image = response.data.results[0];
    }

    function onImageFailure(response){
        alert("Failed to load image please try again!!");
         console.log(response);
    }

---

因此，您可以在dev tools？中看到返回的数据，首先删除标题，您不需要它。是否也执行了故障回调？是的，我在开发工具中看到数据。。。不触发回调。为了确保我使用了console.log（），您可以删除头并尝试先定义这两个变量，然后再使用它们。在定义onImageSuccess和onImageFailure之前，您正在使用它们。@LeandroZubrezki谢谢。小错误，因为在js中是新手。它成功了。所以你可以在dev tools？中看到返回的数据，首先删除标题，你不需要它。是否也执行了故障回调？是的，我在开发工具中看到数据。。。不触发回调。为了确保我使用了console.log（），您可以删除头并尝试先定义这两个变量，然后再使用它们。在定义onImageSuccess和onImageFailure之前，您正在使用它们。@LeandroZubrezki谢谢。小错误，因为在js中是新手。它奏效了。我个人更喜欢底部的定义。主要是因为它总是防止你遇到这些问题。你不需要一直看到实现，但你总是需要一目了然。我也更喜欢命名函数而不是变量：）我个人更喜欢底部定义。主要是因为它总是防止你遇到这些问题。您不需要一直看到实现，但您始终需要一目了然地看到正在发生的事情。我还更喜欢命名函数而不是变量，：）