使用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)渲染出完整页面,再发送到浏览器展现.但这次项目的处理方 ...
随机推荐
- 公共DNS服务
一: 谷歌的 8.8.8.8 8.8.4.4 国内的两组 114.114.114.114 114.114.115.115
- Unity Editor类常用方法
http://www.cnblogs.com/zhaoqingqing/p/3944718.html 一些比较常用的Editor功能我在之前的博客中也有提到过所以就不详细写啦,今天参考了一下 麒麟子( ...
- 算法笔记_028:字符串转换成整数(Java)
1 问题描述 输入一个由数字组成的字符串,请把它转换成整数并输出.例如,输入字符串“123”,输出整数123. 请写出一个函数实现该功能,不能使用库函数. 2 解决方案 解答本问题的基本思路:从左至右 ...
- ant design pro (十四)advanced 使用 CLI 工具
一.概述 原文地址:https://pro.ant.design/docs/cli-cn 为了更好以及高效的开发效率,我们提供了配套的 ant-design-pro-cli 工具. pro cli 提 ...
- No implementation found for long com.baidu.platform.comjni.map.commonmemcache.JNICommonMemCache.Create()
3-21 10:14:20.833 2892-2892/? E/art: No implementation found for long com.baidu.platform.comjni.map. ...
- Appium环境的安装与配置,Python测试脚本测试
Appium自动化测试系列1 - Appium环境的安装与配置 发表于4个月前(2015-01-27 14:34) 阅读(803) | 评论(0) 0人收藏此文章, 我要收藏 赞0 寻找 会’偷懒 ...
- 数据库入门级面试题(带答案) 数据库简单面试题(带答案) MySQL面试题带答案
数据库入门[mysql] 1.假设要按照分页(每页显示10条)的形式获取test表中的数据,在MySql数据库中,以下哪条语句是取第2页中的数据?(单选) (难度A) A.select * f ...
- MS SQL表字段自增相关的脚本
--查询表是否有自增字段 SELECT OBJECTPROPERTY(OBJECT_ID('[表名]'), 'TableHasIdentity') --查询表的自增字段 SELECT COLUMN_N ...
- atitit.激活一个窗口总结 swing java .net php
atitit.激活一个窗口总结 1 激活窗口:鼠标激活vswindows消息激活 1.1 Web框架激活 2 退出激活窗口热键(dbg模式) 3 俩个窗口激活优先级 ...
- 【原创】关于$test$plusargs和$value$plusargs的小结【SystemVerilog/Verilog】
[原创]关于$test$plusargs和$value$plusargs的小结 Abtract $test$plusargs和$value$plusargs作为进行Verilog和SystemVeri ...