[英]How to access object outside the promised function in angularjs
I am new in angularjs and as starter i have a problem with accessing object outside then function. 我是angularjs的新手,作为入门者,我在访问外部对象然后使用函数时遇到问题。 I have created a factory:
我创建了一个工厂:
var injectParams = ['$http'];
var address = function ($http) {
var factory = {};
factory.get = function () {
return $http({
method: "POST",
url: '/address',
headers: {
'Content-Type': 'application/json'
},
data: {
service: 'address'
}
});
};
return factory;
}
And a controller method: 和控制器方法:
function getAddresses() {
address_factory.get().then(function success(response) {
$scope.billing = response.data.billing;
$scope.shipping = response.data.shipping;
console.log(response.data);
}, function error(x) {
console.log(x);
});
}
getAddresses();
The question is how can i access $scope.billing
object outside getAddresses
function? 问题是如何在
getAddresses
函数之外访问$scope.billing
对象? I have read promises in angularjs but i don't understand how to use... 我已经在angularjs中阅读了promises,但我不知道如何使用...
$scope variables are available outse the promise once everywhere in the controller... $ scope变量在控制器中到处都可用一次超过承诺...
Hence $scope.billing will be accessible in html and controller js both... 因此$ scope.billing都可以在html和controller js中访问...
$scope.billing
is accessible everywhere in the controller and the template bound to that controller. $scope.billing
可以在控制器及其绑定的模板中的任何位置访问。 But the value of $scope.billing
is dynamic, it is undefined
until the factory-get Promise is resolved. 但是
$scope.billing
的值是动态的,在解决工厂获得的Promise之前它是undefined
的。 To reflect a dynamic nature of $scope.billing
in the template you may try following approach: 为了在模板中反映
$scope.billing
的动态性质,您可以尝试以下方法:
function getAddresses() {
$scope.loading = true;
address_factory.get().then(function success(response) {
$scope.billing = response.data.billing;
$scope.loading = false;
$scope.error = null;
}, function error() {
$scope.loading = false;
$scope.error = true;
});
}
getAddresses();
and then in the template: 然后在模板中:
<div ng-if="loading">
Loading...
</div>
<div ng-if="!loading && error">
Got an error!
</div>
<div ng-if="!loading && !error">
Billing: {{billing}}
</div>
Also, you may use $scope.$watch
in the controller to watch for $scope.billing
changes: 另外,您可以在控制器中使用
$scope.$watch
来监视$scope.billing
更改:
// ...
getAddresses();
$scope.$watch('billing', function() {
// $scope.billing has been changed
console.log($scope.billing);
});
But I would recommend to do all necessary logic right in the success-callback of the Promise.then
call. 但是我建议在
Promise.then
调用的成功回调中正确执行所有必要的逻辑。
$scope means the current scope that is the current area where some-controller.js & the some-view.html is accessible. $ scope表示当前作用域,它是可访问some-controller.js和some-view.html的当前区域。
If you set any variable to $scope it will be accessible anywhere in the some-controller.js & some-view.html. 如果将任何变量设置为$ scope ,它将可以在some-controller.js和some-view.html中的任何位置访问。
Suppose you set ng-controller to any div as <div ng-controller="SomeController">.....</div>
. 假设您将ng-controller设置为
<div ng-controller="SomeController">.....</div>
。 So any thing with $scope like $scope.something is set in controller will be accessible in the controller and withing this div too, because the scope of the controller is this. 因此,在控制器中设置了$ scope之类的东西,例如$ scope.something,都可以在控制器中访问,并且也可以使用此div,因为控制器的范围是这样。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.