真正的應用需要和真實的服務器進行交互，移動應用和新興的Chrome桌面應用可能是個例外，但是對于此外的所有應用來說，無論你是想把數據持久化到云端，還是需要與其他用戶進行實時交互，都需要讓應用與服務器進行交互。
為了實現這一點，Angular提供了一個叫做$http的服務。它提供了一個可擴展的抽象方法列表，使得與服務器的交互更加容易。它支持HTTP、JSONP和CORS方式。它還包含了安全性支持，避免JSON格式的脆弱性和XSRF。它讓你可以輕松地轉換請求和響應數據，甚至還實現了簡單的緩存。
例如，我們打算讓購物站點從服務器上獲取商品信息，而不是從內存假數據獲取。如何編寫服務端代碼已經超越了本書的范疇，所以，我們僅僅來想象一下，比方說我們已經創建了一個服務器，當查詢/products 路徑時，它會以JSON格式返回一個商品列表。
返回的響應示例如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
[ { "id": 0, "title": "Paint pots", "description": "Pots full of paint", "price": 3.95 }, { "id": 1, "title": "Polka dots", "description": "Dots with that polka groove", "price": 12.95 }, { "id": 2, "title": "Pebbles", "description": "Just little rocks, really", "price": 6.95 } ...etc...] |
我們可以像下面這樣編寫查詢代碼：
|
1
2
3
4
5
6
7
8
9
|
function ShoppingController($scope, $http) { $http.get('/products').success(function(data, status, headers, config) { $scope.items = data; });} |
然后在模板中這樣使用它：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<body ng-controller="ShoppingController"> <h1>Shop!</h1> <table> <tr ng-repeat="item in items"> <td>{{item.title}}</td> <td>{{item.description}}</td> <td>{{item.price | currency}}</td> </tr> </table> </div></body> |
正如我們前面講過的，從長遠來看，讓服務來代理與服務器交互的工作對我們有好處，這個服務可以被多個控制器共享。
