基于angularjs的单页面实例_利用前端MVC框架AngularJS实践设计模式

AngularJS是什么

AngularJS是一个开源Web应用程序框架。最初是由MISKO Hevery和Adam Abrons于2009年开发，现在是由谷歌维护。

特性AngularJS是一个功能强大的基于JavaScript开发框架用于创建富互联网应用(RIA)。

AngularJS为开发者提供的选项(使用JavaScript)在一个干净的MVC(模型-视图-控制器)的方式来编写客户端应用程序。

AngularJS写的应用都是跨浏览器兼容。AngularJS使用JavaScript代码自动处理适应每种浏览器。

AngularJS是开源的，完全免费的，并且由数千名世界各地的开发者开发维护。它是根据Apache许可证2.0版许可发布。

总体来说，AngularJS是一个用来构建大型应用，高性能的Web应用程序的框架，同时使它们易于维护。

核心特征数据绑定: 模型和视图组件之间的数据自动同步。

适用范围: 这些对象参考模型。它们充当控制器和视图之间的胶水。

控制器: 这些Javascript函数绑定到特定的范围。

服务: AngularJS配有多个内置服务，例如$http可作为一个XMLHttpRequest请求。这些单一对象在应用程序只实例化一次。

过滤器: 从一个数组的条目中选择一个子集，并返回一个新的数组。

指令: 指令是关于DOM元素标记(如元素，属性，CSS等等)。这些可以被用来创建作为新的，自定义部件的自定义HTML标签。AngularJS设有内置指令(如：ngBind，ngModel...)

模板:这些符合从控制器和模型信息的呈现的视图。这些可以是单个文件(如index.html)，或使用“谐音”在一个页面多个视图。

路由: 它是切换视图的概念。

模型视图: MVC是一个设计模式将应用划分为不同的部分(称为模型，视图和控制器)，每个都有不同的职责。

深层链接: 深层链接，可以使应用程序状态进行编码在URL中而能够添加到书签。应用程序可从URL恢复到相同的状态。

依赖注入: AngularJS有一个内置的依赖注入子系统，开发人员通过使应用程序从而更易于开发，理解和测试。

AngularJS的简单实例

AngularJs程序分为3部分：模板，表现层逻辑，数据。模板：我们用html，css写的ui视图代码，其中包含AngularJs的指令，表达式，并最终会被AngularJs编译机制编译为附加在dom树上。AngularJs的指令(directive)可以由我们自由扩展。

表现层逻辑：包括应用程序逻辑和行为。用JavaScript定义作为视图控制器逻辑。在AngularJs作为MVC框架，在控制器中我们无需添加对于dom级的事件监听，这些在AngularJs中已经内置了。在ui节点dom事件发生后AngularJs会自动转到scope上的某个行为(Action)逻辑。

数据：视图对象(viewobject)需要被AngularJs Scope(1.0中作为service出现)引用，可以使任何类型的JavaScript对象，数组，基本类型，对象。并且AngularJs会自动异步更新模型，即在ui发生改变的时他会自动刷新模型(mode)，反之在模型发生改变的时候也会自动刷新ui。在这里我们不需要定义形如getter，setter的一些