84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
最近在做一个小项目,由于team里面缺少前端工程师,临时把我抓了过去写完全没有经验的angular。 我看了一些基础的书,感到angular中的rest API 异步传输机制非常神奇。 同时也在想,如果你的下一个http请求中的参数需要上一个请求get的结果,又该如何保证一定能拿到参数,不为空值。 我试过将第二个或第三个等等http请求放在.success后面,确实是成功的,但是这样感觉代码非常冗余,嵌套层次也超级多。 请问大家有什么建议?
The author recommends taking a look at the nested promise and promise chain promise chain
Since Angular’s $http has two built-in shortcut methods, success and error, the standard then method is easy to ignore.
The original poster needs to use promise then nesting For example
$http1.post().then(function(data){ $http2.post(data.data).then(function(data){ console.log(data); }) })
Or use promise chain
$http1.post().then(function(data){ return $http2.post(data.data); }).then(function(data){ console.log(data); })
Different requirements can use different promise forms
For example, you can also use the Q.all method to complete multiple promises before processing events
$http.get('xxxxx') .success(function(data){ $score.data = data; // do somethint... })
Operation in success can ensure that all data is obtained. It is a bit like the chain call of promise.
A piece of code that exists as baseService in a personal project:
/** * Created by thonatos on 14-11-14. */ var ajaxService = angular.module('ASS.service.ajaxService', []) .factory('ajaxService', ['$http', function ($http) { return ({ post: post, get: get, del: del, put: put }); function post(url, data) { var promise = $http.post(url, data).then(function (response) { return response.data; }); return promise; } function get(url) { var promise = $http.get(url).then(function (response) { return response.data; }); return promise; } function del(url) { var promise = $http.delete(url, auth).then(function (response) { return response.data; }); return promise; } function put(url, data) { var promise = $http.put(url, data).then(function (response) { return response.data; }); return promise; } }]); module.exports = ajaxService;
The following is the specific postService:
/** * Created by thonatos on 14-11-8. */ var _postUrl = '/api/post'; var _postsUrl = '/api/posts' var _user = 'thonatos'; var postService = angular.module('ASS.service.postService', []) .factory('postService', ['ajaxService', function (ajaxService) { return ({ add: _add, del: _del, rev: _rev, get: _get, getAll: _getAll }); function _add(post) { post.category = post.category.name; post.author = _user || 'nobody'; console.log(post); return ajaxService.post(_postUrl, post); } function _del(pid) { return ajaxService.delete(_postUrl + '/' + pid); } function _rev(pid, post) { return ajaxService.put(_postUrl + '/' + pid, post); } function _get(pid) { return ajaxService.get(_postUrl + '/' + pid); } function _getAll(pager) { return ajaxService.get(_postsUrl + '/' + pager); } }]); module.exports = postService;
The last thing in blogConroller is probably like this:
blog.controller('blogPostCtrl', ['$scope', '$stateParams', 'postService', function ($scope, $stateParams, postService) { var _pid = $stateParams.pid; var _post = {}; postService.get(_pid).then(function (response) { _post = response; $scope.post = _post; }); }]);
If the backend ensures a good REST interface style, it is recommended to use the $resource official plug-in:
app.factory 'User', ['$resource', ($resource)-> $resource '/api/u/:name', {name: "@name"} ]
You can use it now:
app.controller 'mainCtrl', ['$scope', 'User', ($scope, User)-> ... ]
The author recommends taking a look at the nested promise and promise chain promise chain
Since Angular’s $http has two built-in shortcut methods, success and error, the standard then method is easy to ignore.
The original poster needs to use promise then nesting
For example
Or use promise chain
Different requirements can use different promise forms
For example, you can also use the Q.all method to complete multiple promises before processing events
Operation in success can ensure that all data is obtained. It is a bit like the chain call of promise.
A piece of code that exists as baseService in a personal project:
The following is the specific postService:
The last thing in blogConroller is probably like this:
If the backend ensures a good REST interface style, it is recommended to use the $resource official plug-in:
You can use it now: