javascript - angularjs中$http嵌套$http的优雅写法
大家讲道理
大家讲道理 2017-04-11 11:01:18
[JavaScript讨论组]
$http.get(url).success(function(){
    ...
    $http.get(url).success(function(){
    ...
    })
})

因为里面的$http用到外面返回的值做地址参数,所以嵌套着写,但这样感觉不是很优雅,有没有一种方法解决,最好给示例......跪拜大神支招

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(6)
伊谢尔伦

试试这个呢

$http({ method: 'GET', url: '/someUrl' })
  .then(response => {
    return $http({ method: 'GET', url: response.data.url }).catch(errHandle);
  })
  .then(p => {
     console.log(p)
  })
  .catch(errHandle);

function errHandle(err){
  console.dir(err);
}
天蓬老师
$http.get(url).success(function(rsp){
    $scope.fun1(rsp)
})

$scope.fun1 = function(rsp) {     
    $http.get(url, rsp).success(function(){
        //...
    })
}
巴扎黑

我的写法是根据模块创建service,由一个专门访问后端的RestService来处理$http请求。具体如下

//RestService,将$http方法封装下,这里只列举了get和post,可能还会有put等方法
function get(){
    return $http.get(url);
}
function post(url,data){
    return $http.post(url,data);
}

//各模块service,eg. UserService, 获取user信息和修改user信息
function getUserInfo(){
    return RestService.get('UserInfoAPI');
}

function modifyUserInfo(data){
    return RestService.post('UserInfoAPI',data);
}

//controller,要给当前的user涨工资15%
UserService.getUserInfo()
    .then(function(response){
        return response;
    })
    .then(function(userInfo){
        userInfo.salary = userInfo.salary * 1.15;
        return UserService.modifyUserInfo(userInfo);
    })
    .then(function(result){
        console.log('success->',result);
    })
    .catch(function(error){
        console.log('something gose wrong->',error);
    })

大概就是这个意思,把嵌套变成链式执行就好了。

PHP中文网
Promise.resolve()
    .then(() => $http({method: 'GET', url: url}))
    .then(response1 => $http({method: 'GET', url: response1.url})
    .then(response2 => {
        // ...use response2
    });

需要es6的Promise

PHP中文网

AngularJS的 $http返回的是Promise对象,所以如果你使用ECMAScript 7或TypeScriprt的话可以使用async/await来处理:

let fn = function() {
    response_1 = await $http.get(url_1);
    response_2 = await $http.get(url_2, response_1);
}

这样是可以保证使用异步的同时使用同步的思路写代码。

巴扎黑

angular $q服务

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号