Question

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

在我的控制器内部，我使用$routeParams服务收到的输入调用$ http服务。我所有的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以从REST API获取数据。

这是我的控制器：

 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);
        };
    }

在Chrome开发人员工具的“网络”标签中，响应可见，但上面的方法是我设置的响应未触发。

请帮忙

Answer 1

您应首先定义变量然后使用它们。定义变量与定义函数不同。所以你可以：

    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);
    }

$ http服务没有触发控制器angularjs中的成功处理程序？

1 个答案: