Page 199 - AngularJS权威教程

18.4 调用 API 179

<script src="javascripts/services.js"></script> 1
<script src="javascripts/app.js"></script>
</body>
</html>
2
在public/javacscripts/app.js文件中，我们在myApp Angular模块的顶部添加一个控制器：

angular.module('myApp', [ 3
'ngRoute',
'myApp.services'
])
.controller('HomeController', function($scope, HitService) { 4
HitService.count()
.then(function(data) {
$scope.hits = data; 5
});

$scope.registerHit = function() {
HitService.registerHit() 6
.then(function(data) {
$scope.hits = data;
}); 7
}
});
我们会建立一个Angular服务来响应对这些路由的调用，就像在上面的控制器里看到的那样： 8

angular.module('myApp.services', [])
.factory('HitService', function($q, $http) { 9
var service = {
count: function() {
var d = $q.defer();
$http.get('/hits') 10
.success(function(data, status) {
d.resolve(data.hits);
}).error(function(data, status) { 11
d.reject(data);
});
return d.promise; 12
},
registerHit: function() {
var d = $q.defer();
$http.post('/hit', {}) 13
.success(function(data, status) {
d.resolve(data.hits);
}).error(function(data, status) { 14
d.reject(data);
});
return d.promise;
} 15
}
return service;
}); 16
有关服务的更多信息，敬请参阅第14章。
这个服务暴露了两种调用前文定义过的路由的方法： 17

 count
 registerHit 18