Skip to content

Instantly share code, notes, and snippets.

Created February 8, 2015 10:33
Show Gist options
  • Save anonymous/6dc56cf020d41bd182f2 to your computer and use it in GitHub Desktop.
Save anonymous/6dc56cf020d41bd182f2 to your computer and use it in GitHub Desktop.
AngularJS $http Promise Chain
<html ng-app="myApp">
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.8/angular-sanitize.js"></script>
<meta charset=utf-8 />
<title>$http's Promise Chain</title>
</head>
<body>
<div class="container" ng-controller="MainCtrl">
第一段:<pre>{{part1|json}}</pre>
<br><br>
第二段:<pre>{{part2|json}}</pre>
<br><br>
第三段:<pre>{{part3|json}}</pre>
</div>
</body>
</html>
angular.module('myApp', []).controller('MainCtrl', function($scope, $http) {
$http.get('http://jsbin.com/http-promise-chain-json/1.json')
.then(function(json) {
$scope.part1 = json.data;
return $http.get('http://jsbin.com/http-promise-chain-json/2.json');
})
.then(function(json) {
$scope.part2 = json.data;
return $http.get('http://jsbin.com/http-promise-chain-json/3.json');
})
.then(function(json) {
$scope.part3 = json.data;
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment