如何在angularjs中访问$ http.get方法的.success内部的url
[英]how to access the url inside .success of the $http.get method in angularjs
问题描述
I have the following controller 
我有以下控制器
var app = angular.module('callapp', []);
app.controller('eController', function($scope, $http, $log) {
$scope.urlString = []; //this is filled with values
for( var i=0; i<3; ++i)
{
var currentURL = $scope.urlString[i];
$http.get(currentURL)
.success( function(response) {
//how do I access currentURL here?
$log.info(this.currURL) //this is printing "undefined"
});
}
The urls are generated dynamically, and I have to get data from these urls. 这些网址是动态生成的，我必须从这些网址中获取数据。 The urls are generated before the for loop executes (and the url requests are asynchronous). 网址是在for循环执行之前生成的（网址请求是异步的）。
I tried $.ajax(currentURL) instead of $http.get method, but I got the same result - "undefined". 我尝试使用$ .ajax（currentURL）而不是$ http.get方法，但是得到了相同的结果-“ undefined”。
Is there any way I can access the currentURL and the current value of 'i' inside the .success(function ())? 有什么方法可以访问.success（function（））中的currentURL和'i'的当前值？
4 个解决方案
解决方案1
2 已采纳 2015-05-28 13:27:28
currentUrl is easily accessible, and since you're making AJAX requests inside a for loop, you will always get i to be the last index value because the renderer will print the value when the AJAX req gives 200 which will take some time and within that time for loop would have executed, so always the last index value will be there in i . currentUrl易于访问，并且由于您是在for循环中发出AJAX请求，因此您始终将i设为最后一个index值，因为当AJAX req给出200时，渲染器将打印该值，这将花费一些时间，并且在此范围内时间for循环将已经执行，所以总是最后一个索引值将在那里i 。 For this, you have to use IIFE 为此，您必须使用IIFE
For the purpose of Demo, I'm using a Fake Online REST API - http://jsonplaceholder.typicode.com/ 出于演示目的，我使用了一个伪造的在线REST API- http://jsonplaceholder.typicode.com/
RUNNING DEMO: http://plnkr.co/edit/djPMu4UH9t9BeGwBcUMI 正在运行的演示： http : //plnkr.co/edit/djPMu4UH9t9BeGwBcUMI
HTML : HTML ：
<body ng-app="callapp" ng-controller="eController">
</body>
JS : JS ：
var app = angular.module('callapp', []);
app.controller('eController', function($scope, $http, $log) {
$scope.baseUrl = "http://jsonplaceholder.typicode.com/posts/";
$scope.urlString = [
$scope.baseUrl + '1',
$scope.baseUrl +'2',
$scope.baseUrl + '3'
]; //this is filled with values
for( var i=0; i<3; ++i) {
(function(index) {
var currentURL = $scope.urlString[i];
$http.get(currentURL)
.success( function(response) {
$log.info(index+1, currentURL);
});
})(i);
}
});
app.$inject = ['$scope', '$http', '$log'];
解决方案2
0 2015-05-28 12:20:50
You can register an HttpInterceptor. 您可以注册一个HttpInterceptor。 In the interceptor it's possible to catch/handle all requests. 在拦截器中，可以捕获/处理所有请求。
More info at: https://docs.angularjs.org/api/ng/service/$http#interceptors 有关更多信息， 请访问： https : //docs.angularjs.org/api/ng/service/$http#interceptors
$provide.factory('myHttpInterceptor', function($q) {
return {
// optional method
'request': function(config) {
// This is your URL:
console.log(config.url);
return config;
},
};
});
Don't forget to register the httpInterceptor like this: $httpProvider.interceptors.push('myHttpInterceptor'); 不要忘记像这样注册httpInterceptor： $httpProvider.interceptors.push('myHttpInterceptor');
解决方案3
0 2015-05-28 12:21:26
store value in $scope variable because this.currUrl is undefined 将值存储在$ scope变量中，因为this.currUrl是未定义的
var app = angular.module('callapp', []);
app.controller('eController', function($scope, $http, $log) {
$scope.urlString = []; //this is filled with values
for( var i=0; i<3; ++i)
{
$scope.currentURL = $scope.urlString[i];
$http.get($scope.currentURL)
.success( function(response) {
//how do I access currentURL here?
});
$log.info($scope.currentURL);
}
解决方案4
0 2017-06-04 06:56:14
Instead of using for loop use angular forEach .For more information on angularForeach visit https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach?v=control 代替使用for循环，请使用angular forEach。有关angularForeach的更多信息，请访问https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach?v=control
var app = angular.module('callapp', []);
app.controller('eController', function($scope, $http, $log) {
$scope.baseUrl = "http://jsonplaceholder.typicode.com/posts/";
$scope.urlString = [$scope.baseUrl + '1', $scope.baseUrl +'2',$scope.baseUrl + '3']; //this is filled with values
angular.forEach($scope.urlString,function(value,key){
$http.get(value)
.success( function(response) {
$log.info(value)
});
}
});
app.$inject = ['$scope', '$http', '$log'];
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.