$http 服务未在控制器 angularjs 中触发成功处理程序?
$http service not triggered success handler within controller angularjs?
我正在处理 AngularJS 应用程序。在最初构建基本应用程序后,我已经转向 angular 中的路由。我已经成功实现了路由。我之前页面的数据使用 $routeParams
.
进入我正在路由的页面
在我的控制器中,我使用从 $routeParams
服务收到的输入调用 $http 服务。我全部 REST API,在 chrome 的网络选项卡中,我看到响应返回,但我的 http 服务成功处理程序未 called.Tried 进行调试,但从未达到断点。
这是我的路由配置:
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 开发人员工具的网络选项卡中,响应是可见的,但上面我设置响应的方法未触发。
请帮忙
您应该先定义您的变量,然后再使用它们。定义变量不同于定义函数。所以你可以:
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);
}
我正在处理 AngularJS 应用程序。在最初构建基本应用程序后,我已经转向 angular 中的路由。我已经成功实现了路由。我之前页面的数据使用 $routeParams
.
在我的控制器中,我使用从 $routeParams
服务收到的输入调用 $http 服务。我全部 REST API,在 chrome 的网络选项卡中,我看到响应返回,但我的 http 服务成功处理程序未 called.Tried 进行调试,但从未达到断点。
这是我的路由配置:
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 开发人员工具的网络选项卡中,响应是可见的,但上面我设置响应的方法未触发。
请帮忙
您应该先定义您的变量,然后再使用它们。定义变量不同于定义函数。所以你可以:
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);
}