使用AngularJS实现的前后端分离的数据交互过程
一. AngularJS简介
AngularJS是什么
AngularJS是一个开源Web应用程序框架。最初是由MISKO Hevery和Adam Abrons于2009年开发,现在是由谷歌维护。
AngularJS的特性
- AngularJS是一个功能强大的基于JavaScript开发框架用于创建富互联网应用(RIA)。
- AngularJS为开发者提供的选项(使用JavaScript)在一个干净的MVC(模型-视图-控制器)的方式来编写客户端应用程序。
- AngularJS写的应用都是跨浏览器兼容。AngularJS使用JavaScript代码自动处理适应每种浏览器。
- AngularJS是开源的,完全免费的,并且由数千名世界各地的开发者开发维护。它是根据Apache许可证2.0版许可发布。
总体来说,AngularJS是一个用来构建大型应用,高性能的Web应用程序的框架,同时使它们易于维护。
AngularJS的核心特征
- 数据绑定: 模型和视图组件之间的数据自动同步。
- 适用范围: 这些对象参考模型。它们充当控制器和视图之间的胶水。
- 控制器: 这些Javascript函数绑定到特定的范围。
- 服务: AngularJS配有多个内置服务,例如$http可作为一个XMLHttpRequest请求。这些单一对象在应用程序只实例化一次。
- 过滤器: 从一个数组的条目中选择一个子集,并返回一个新的数组。
- 指令: 指令是关于DOM元素标记(如元素,属性,CSS等等)。这些可以被用来创建作为新的,自定义部件的自定义HTML标签。AngularJS设有内置指令(如:ngBind,ngModel...)
- 模板:这些符合从控制器和模型信息的呈现的视图。这些可以是单个文件(如index.html),或使用“谐音”在一个页面多个视图。
- 路由: 它是切换视图的概念。
- 模型视图: MVC是一个设计模式将应用划分为不同的部分(称为模型,视图和控制器),每个都有不同的职责。
- 深层链接: 深层链接,可以使应用程序状态进行编码在URL中而能够添加到书签。应用程序可从URL恢复到相同的状态。
- 依赖注入: AngularJS有一个内置的依赖注入子系统,开发人员通过使应用程序从而更易于开发,理解和测试。
二. 场景简介
- 后端全是REST风格API;
- 前端通过AngularJS实现;
三. 前后端交互过程
- 前端通过AngularJS的路由功能来区分不同的逻辑页面并将不同的页面绑定到对应的控制器上;
- 控制器负责将相应的数据和方法绑定到页面元素并执行相应的操作(包括factory方法的调用);
- 工厂方法主要用来动态获取(REST)页面的数据,即请求server端的路由(比如:overview/overview),调用相应的路由函数获取数据;
- factory方法通过依赖注入到相应的控制器中。
使用AngularJS实现的前后端分离的数据交互过程的更多相关文章
- 前后端分离后API交互如何保证数据安全性
前后端分离后API交互如何保证数据安全性? 一.前言 前后端分离的开发方式,我们以接口为标准来进行推动,定义好接口,各自开发自己的功能,最后进行联调整合.无论是开发原生的APP还是webapp还是PC ...
- [开源] angularjs + Asp.net 前后端分离解决方案
本文版权归 博客园 萧秦 所有,此处为技术收藏,如有再转,请于篇头明显位置标明原创作者及出处,以示尊重! 作者:萧秦 原文:http://www.cnblogs.com/xqin/p/4862849. ...
- AngularJS中在前后端分离模式下实现权限控制 - 基于RBAC
一:RBAC 百科解释: 基于角色的访问控制(Role-Based Access Control)作为传统访问控制(自主访问,强制访问)的有前景的代替受到广泛的关注.在RBAC中,权限与角色相关联,用 ...
- 前后端分离-模拟数据之RAP2快速入门
是啥? RAP是一个可视化接口管理工具 通过分析接口结构,动态生成模拟数据,校验真实接口正确性, 围绕接口定义,通过一系列自动化工具提升我们的协作效率.我们的口号:提高效率,回家吃晚饭! 可视化编辑, ...
- 前后端分离后API交互如何保证数据安全性?
一.前言 前后端分离的开发方式,我们以接口为标准来进行推动,定义好接口,各自开发自己的功能,最后进行联调整合.无论是开发原生的APP还是webapp还是PC端的软件,只要是前后端分离的模式,就避免不了 ...
- 前后端分离构架 与 json ajax简介
前后端分离 传统开发方式 曾几何时,JSP和Servlet为Java带来了无限风光,一时间大红大紫,但随着互联网的不断发展,这样的开发方式逐渐显露其弊端,在移动互联网炙手可热的今天,应用程序对于后台服 ...
- 【开源】分享一个前后端分离方案-前端angularjs+requirejs+dhtmlx 后端asp.net webapi
一.前言 半年前左右折腾了一个前后端分离的架子,这几天才想起来翻出来分享给大家.关于前后端分离这个话题大家也谈了很久了,希望我这个实践能对大家有点点帮助,演示和源码都贴在后面. 二.技术架构 这两年a ...
- 前后端分离之前端项目构建(grunt+require+angular)
前言 前段时间做了一个项目,前端开发页面,然后把代码给到后端同学,后端同学通过vm再来渲染页面.后来才发现,这种方式简直是太low了,因为前端代码在服务端同学那里,每次前端需要更改的时候都需要去到服务 ...
- 在前后端分离Web项目中,RBAC实现的研究
最近手头公司的网站项目终于渐渐走出混沌,走上正轨,任务也轻松了一些,终于有时间整理和总结一下之前做的东西. 以往的项目一般使用模板引擎(如ejs)渲染出完整页面,再发送到浏览器展现.但这次项目的处理方 ...
随机推荐
- Jquery重新学习之二[属性attr(),removeAttr(),prop(),removeProp()]
1:属性.attr(name|pro|key,val|key,fn)与removeAttr(name) 1.1 .attr(name) 参数name为属性名称 <a id="my_hr ...
- test推荐到极客头条002
test推荐到极客头条002test推荐到极客头条002test推荐到极客头条002test推荐到极客头条002test推荐到极客头条002test推荐到极客头条002test推荐到极客头条002te ...
- Android 常用的性能分析工具详解:GPU呈现模式, TraceView, Systrace, HirearchyViewer(转)
此篇将重点介绍几种常用的Android性能分析工具: 一.Logcat 日志 选取Tag=ActivityManager,可以粗略地知道界面Displaying的时间消耗.当我们打开一个Activit ...
- Linux cmp命令——比较二进制文件(转)
Linux cmp命令用于比较两个文件是否有差异. 当相互比较的两个文件完全一样时,则该指令不会显示任何信息.若发现有所差异,预设会标示出第一个不同之处的字符和列数编号.若不指定任何文件名称或是所给予 ...
- 30、Arrays工具类
1.查询元素 int binarySearch(type[] a,type key):使用二分法查询key元素值在a数组中出现的索引:如果a数组不包含key元素,则返回负数.调用该方法时要求数组中元素 ...
- linux命令:tail 命令
tail 命令从指定点开始将文件写到标准输出.使用tail命令的-f选项可以方便的查阅正在改变的日志文件,tail -f filename会把filename里最尾部的内容显示在屏幕上,并且不但刷新, ...
- 具有SSM框架的CRUD与多条件查询
概述 居于ssm版本的crud跟多添加查询, 并带分页的demo 详细 代码下载:http://www.demodashi.com/demo/13653.html 一.功能展示 部门CRUD: 员工C ...
- MongoDB 日志太大怎么办?
MongoDB的日志增长的非常快,/var所在的空间立即就占满了,即便换到还有一个磁盘分区保存日志.日志还是增长的非常快.磁盘眼看要告磬. 有一个好办法,就是使用旋转日志. MongoDB的旋转日志有 ...
- 王立平--svnserver搭建
1.下载 2.安装打开. 3.新建存储库. ---------------------------------- 4.新建用户. watermark/2/text/aHR0cDovL2Jsb2cuY3 ...
- 【TP5.0】页面布局,引入公共的模版文件
1.实例:如后台admin模块,公用一个header.html和footer.hml 2.模块结构: 3.使用方式: {include file="common/header"} ...