angularjs与服务器交互

真正的应用需要和真实的服务器进行交互,移动应用和新兴的Chrome桌面应用可能是个例外,但是对于此外的所有应用来说,无论你是想把数据持久化到云端,还是需要与其他用户进行实时交互,都需要让应用与服务器进行交互。

为了实现这一点,Angular提供了一个叫做$http的服务。它提供了一个可扩展的抽象方法列表,使得与服务器的交互更加容易。它支持HTTP、JSONP和CORS方式。它还包含了安全性支持,避免JSON格式的脆弱性和XSRF。它让你可以轻松地转换请求和响应数据,甚至还实现了简单的缓存。

例如,我们打算让购物站点从服务器上获取商品信息,而不是从内存假数据获取。如何编写服务端代码已经超越了本书的范畴,所以,我们仅仅来想象一下,比方说我们已经创建了一个服务器,当查询/products 路径时,它会以JSON格式返回一个商品列表。

返回的响应示例如下:

[

{

"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...

]

我们可以像下面这样编写查询代码:

function ShoppingController($scope, $http) {

$http.get(‘/products‘).success(function(data, status, headers, config) {

$scope.items = data;

});

}

然后在模板中这样使用它:

<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>

正如我们前面讲过的,从长远来看,让服务来代理与服务器交互的工作对我们有好处,这个服务可以被多个控制器共享。

来自《AngularJS开发下一代Web应用》一书

在线版在https://github.com/edagarli/AngularJSWeb

angularjs与服务器交互

时间: 2024-11-04 09:22:03

angularjs与服务器交互的相关文章

AngularJS与服务器交互(4)

转自:http://itindex.net/detail/50919-angularjs-%E6%9C%8D%E5%8A%A1%E5%99%A8-%E4%BA%A4%E4%BA%92 对于AJAX应用(使用XMLHttpRequests)来说,向服务器发起请求的传统方式是:获取一个XMLHttpRequest对象的引用.发起请求.读取响应.检查状态码,最后处理服务端的响应.整个过程示例如下: var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadys

利用ajax短轮询+php与服务器交互制作简易即时聊天网站

主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Server-sent Events). 本文主要介绍ajax短轮询的简易实现方式. 看懂此文需要:ajax基础,php基础,sql基础,html/jquery基础 ---------------------------- 本人也是web新手,今天听说女票在学websocket,还做了个简易的网站利用广播和我通信.但是刷新一下数据就没了.. 我觉得这个还是挺有意思的,,就想着能不能做一个刷新

angularJS开启服务器后台运行程序,找不到scripts/web-server.js

学习angularJS时,教程里说使用node scripts/web-server.js开启服务器后台运行程序.一直出错.后来发现原因是这是老版本里的命令.现在都是用sudo npm start就可以了 运行完sudo npm start,再开启karma测试 sudo npm test 然后再浏览器中输入http://localhost:8000/app/index.html即可访问angularJS教程里的index.html. angularJS开启服务器后台运行程序,找不到script

ajax短轮询+php与服务器交互制作简易即时聊天网站

主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Server-sent Events). 本文主要介绍ajax短轮询的简易实现方式. 看懂此文需要:ajax基础,php基础,mysql基础,html/jquery基础 ---------------------------- 本人也是web新手,今天听说女票在学websocket,还做了个简易的网站利用广播和我通信.但是刷新一下数据就没了.. 我觉得这个还是挺有意思的,,就想着能不能做一个

Androidannotation使用之@Rest与服务器交互的JSON数据转换(二)

开篇 之前的一篇博客:Androidannotation使用之@Rest获取资源及用户登录验证(一):http://blog.csdn.net/nupt123456789/article/details/24384713 主要写了Rest在用户登录的时候,需要JSESSION字段的问题.本博客主要写JSON格式的转换. @Rest的参考文档: https://github.com/excilys/androidannotations/wiki/Rest-API#rest 简介: 从上一篇博客中,

从高处理解android与服务器交互(看懂了做开发就会非常的容易)

今天帮一个朋友改一个bug 他可以算是初学者吧 .我给他看了看代码,从代码和跟他聊天能明显的发现他对客户端与服务器交互 基本 不是很了解.所以我花了更多时间去给他讲客户端与服务器的关系.我觉得从这个高度去做客户端开发会对开发的提高有十倍甚至百倍的效果.我希望更多的人能理解更多的人能收到帮助.所以把这个总结了一下发布出来. 首先:我介绍下服务器的一些东西 服务器开发是一门很深的学问不是一句话两句话能理解的,至少比android开发要复杂很多倍,至少想开发好是非常难的.这里只讲android需要理解

ASP.NET 表单验证方法与客户端(浏览器)服务器交互机制的故事

想到这个问题完全是一个意外吧,是在寻找另外一个问题答案的过程中,才对验证方法与浏览器服务器交互机制的关系有了清晰的认识. 先说下验证方法,验证方法分为前台验证和后台验证. 前台验证就是类似jQuery.Validate这类的插件,当然也可以我们自己写. 后台验证就是ASP.NET自带的验证控件,如RequiredFieldValidator. 记得初学.NET的时候,那会儿接触验证控件,也知道验证分为前台,后台.但是随着时间的推移,由于做的项目基本上都是公司内部使用的软件,比如OA.因为这种项目

android 客户端与服务器交互 UDP方式。

客户端代码: /** * 开启UDP发送 * * @author gzh */ public class Client implements Runnable { @Override public void run() { try { wifiGPSInfo = new WifiGPSInfo(); wifiGPSInfo.setStatusCode("32");// 签到 Intent intent = getIntent(); // 用于激活它的意图对象 String acc =

android客户端与服务器交互数据(基于SAOP协议的远程调用标准,通过webservice可以将不同操作系统平台,不同语言,不同技术整合)

在PC机器java客户端中,需要一些库,比如XFire,Axis2,CXF等等来支持访问WebService,但是这些库并不适合我们资源有限的android手机客户端,做过JAVA ME的人都知道有KSOAP这个第三方的类库,可以帮助我们获取服务器端webService调用,当然KSOAP已经提供了基于android版本的jar包 首先下载KSOAP包:ksoap2-android-assembly-2.5.2-jar-with-dependencies.jar包 然后新建android项目 以