以下是一个简单的例子，演示如何在 AngularJS 中使用 XHR 发送 HTTP 请求，并使用依赖注入将服务注入到控制器中：
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>AngularJS XHR 和 依赖注入</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js"></script>
</head>
<body>
<div ng-controller="myCtrl">
<h2>AngularJS XHR 和 依赖注入示例</h2>
<ul>
<li ng-repeat="user in users">{{ user.name }}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
// 定义一个服务（Service）
app.service('userService', function ($http) {
this.getUsers = function () {
// 使用 $http 发送 HTTP 请求
return $http.get('https://jsonplaceholder.typicode.com/users');
};
});
// 在控制器中注入 userService 服务
app.controller('myCtrl', function ($scope, userService) {
// 使用服务中的方法获取数据
userService.getUsers().then(function (response) {
// 将获取的用户数据绑定到 $scope.users
$scope.users = response.data;
});
});
</script>
</body>
</html>
在这个例子中，有几个关键点：
1. userService 服务： 使用 app.service 定义了一个名为 userService 的服务。这个服务包含一个 getUsers 方法，该方法使用 $http 服务发起了一个 GET 请求，获取远程数据。
2. 依赖注入： 在控制器中通过参数注入 userService 服务，AngularJS 会自动将服务实例注入到控制器中。
3. 使用服务： 在控制器中调用 userService.getUsers() 方法，获取远程数据并将其绑定到 $scope.users。
这是一个简单的例子，演示了在 AngularJS 中使用 XHR 进行 HTTP 请求以及如何使用依赖注入将服务注入到控制器中。在实际应用中，你可能会处理更复杂的数据操作，但这个例子提供了一个基本的框架。
转载请注明出处：http://www.pingtaimeng.com/article/detail/4887/Angular