jQuery 来自 AngularJS 的 $success 回调函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/19811655/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
$success call back function from AngularJS
提问by Dayanithi Hari
I am calling the controller to get the API value. How do I pass the array outside of the $http method?
我正在调用控制器以获取 API 值。如何在 $http 方法之外传递数组?
I need to pass an array, pa[]
, to the $scope.myData = pa;
.
我需要将一个数组 , 传递pa[]
给$scope.myData = pa;
.
First, console.log(pa) prints the value [10,20,30,40].
首先,console.log(pa) 打印值 [10,20,30,40]。
Second, console.log(pa) empties array[].
其次,console.log(pa) 清空数组[]。
JavaScript
JavaScript
function Ctrl($scope, $http) {
var url = "https://spreadsheets.google.com/feeds/list/0AsXjbsnPIu06dGswZUV4WX/values?alt=json-in-script&callback=angular.callbacks._0";
var pa = [];
$http({
method: 'JSONP',
url: url
}).success(function (data) {
for (i = 0; i < data.feed.entry.length; i++) {
var entry = data.feed.entry[i];
pa.push(entry.gsx$productivity.$t);
console.log(pa); //[10,20,30,40,50]
}
});
console.log(pa) // [] empty array
$scope.myData = pa;
}
How do I get the array outside of the $success callback function?
如何在 $success 回调函数之外获取数组?
回答by M.K. Safi
This code is asynchronous. pa
is assigned to $scope.myData
before the $http
service has had a chance to get the value from your API call.
此代码是异步的。在服务有机会从您的 API 调用中获取值之前pa
分配给。$scope.myData
$http
You need to use the $q
service promise library to control the flow of your code. Something like this:
您需要使用$q
服务承诺库来控制代码流。像这样的东西:
function Ctrl($scope, $http, $q) {
var url = "https://spreadsheets.google.com/feeds/list/0AsXjbsnPIu06dGswZUV4WX/values?alt=json-in-script&callback=angular.callbacks._0";
var pa = [];
var paPromise = $q.defer()
$http({
method: 'JSONP',
url: url
}).success(function(data) {
for (i = 0; i < data.feed.entry.length; i++) {
var entry = data.feed.entry[i];
pa.push(entry.gsx$productivity.$t);
console.log(pa); //[10,20,30,40,50]
}
paPromise.resolve(pa)
});
$scope.myData = paPromise.promise;
}
Here, we inject the $q
service and instantiate a variable paPromise
using it. Next, we give this promise to $scope.myData
. Once the promise gets resolved inside the $http
success method, AngularJS will notify your $scope
and update the value and it'll be reflected on your template/DOM.
在这里,我们注入$q
服务并paPromise
使用它实例化一个变量。接下来,我们将这个承诺交给$scope.myData
。一旦 promise 在$http
成功方法中得到解决,AngularJS 将通知您$scope
并更新该值,它将反映在您的模板/DOM 上。
回答by Mike Thomsen
This really doesn't make a lot of sense. It should just be like this:
这真的没有多大意义。它应该是这样的:
$scope.myData = [];
$http({
method: 'JSONP',
url: url
}).success(function (data) {
for (i = 0; i < data.feed.entry.length; i++) {
var entry = data.feed.entry[i];
$scope.myData.push(entry.gsx$productivity.$t);
console.log(pa); //[10,20,30,40,50]
}
});
Since pa
was set inside of the controller function, it doesn't buy you anything to declare it and then set $scope.myData
equal to pa
. That's just asking for trouble.
因为pa
是在控制器函数内部设置的,所以它不会给你任何东西来声明它然后设置$scope.myData
等于pa
. 那只是自找麻烦。
回答by shyammtp
If you prefer jQuery Ajax, use the extend
function to return the success data outside,
如果你更喜欢 jQuery Ajax,使用extend
函数将成功数据返回到外面,
$(function(){
$.extend({
returnData: function(url) {
var result = null;
var pa = [];
$.ajax({
url: url,
type: 'get',
dataType: 'jsonp',
async: false,
success: function(data) {
for (i = 0; i < data.feed.entry.length; i++) {
var entry = data.feed.entry[i];
pa.push(entry.gsx$productivity.$t);
}
result = pa;
}
});
return result;
}
});
});
finaldata = $.returnData('https://spreadsheets.google.com/feeds/list/0AsXjbsnPIu06dGswZUV4WX/values?alt=json-in-script&callback=angular.callbacks._0');
console.log(finaldata);