理解 AngularJS $q service and promises
发布时间:2020-12-17 09:18:46 所属栏目:安全 来源:网络整理
导读:Angularjs中的“$q”和 http访问的promises对象经常见到,本文主要介绍AngularJS $q service and promises。 原文地址http://haroldrv.com/2015/02/understanding-angularjs-q-service-and-promises/ 介绍Angularjs $q service之前,我们需要了解promise是什
Angularjs中的“$q”和 http访问的promises对象经常见到,本文主要介绍AngularJS $q service and promises。 原文地址http://haroldrv.com/2015/02/understanding-angularjs-q-service-and-promises/
介绍Angularjs $q service之前,我们需要了解promise是什么,它的作用是什么。 什么是promise
promise在JavaScript和angularjs中,是指我们通过执行某个动作(如:click button)后,在将来某个时间点返回数据的对象。让我们看以下两种情况。
为什么需要promise
我们需要promise是因为需要根据返回的结果(或者不返回结果)做出决定,下面的用一个例子说明。
我们的程序通过访问服务器API获取客户列表。
如果获取到response返回数据后,将数据显示到屏幕中;
如果不能获取到response返回数据时,提示用户。
使用$q service 处理promise
angularjs中提供了$q 处理异步请求并且可以获得API的返回值。其真正出彩的地方是用户可以自定义promise。
看一个简单的例子。
var deferred = $q.defer(); // deferred 中包含了带有返回值的promise // 解析带有返回值的promise使用.resolve deferred.resolve(data); // 解析被拒绝的promise 使用 .reject deferred.reject(error);现在,看一下angularjs如何具体实现。 app.service("githubService",function ($http,$q) { var deferred = $q.defer(); this.getAccount = function () { return $http.get('https://api.github.com/users/haroldrv') .then(function (response) { // promise is fulfilled deferred.resolve(response.data); // promise is returned return deferred.promise; },function (response) { // the following line rejects the promise deferred.reject(response); // promise is returned return deferred.promise; }) ; }; });最终,angularjs controller中使用该service并且显示结果或提示用户数据不能返回。 app.controller("promiseController",function ($scope,$q,githubService) { githubService.getAccount() .then( function (result) { // promise was fullfilled (regardless of outcome) // checks for information will be peformed here $scope.account = result; },function (error) { // handle errors here console.log(error.statusText); } ); }); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |