AngularJS总结

AngularJS总结

 

2018年8月27日

• AngularJS是什么

    AngularJS是一个MVC框架，不是类库。它不仅仅是一个JavaScript框架，因为它的核心其实是对HTML标签的增强。

那么何为HTML标签增强？其实就是咱们在开发过程中使用标签完成的一部分页面逻辑，具体方式是通过自定义标签、自定义属性等实现的

为了实现这些，AngularJS引入了一些非常好的特性，包括模板机制、数据绑定、依赖注入、路由、模块、指令、。通过数据与模板的绑定，能够让我们摆脱繁琐的操作，在开发过程中可以将注意力集中在业务逻辑上。

• 什么时候用AngularJs

AngularJS是一个 MVC 框架，最适于开发客户端的单页面应用。它不是个功能库，而是用来开发动态网页的框架。它专注于扩展HTML的功能，提供动态数据绑定，而且它能跟其它框架（如jQuery）合作融洽。

如果要开发的是单页应用，AngularJS就是开发的上上之选。

• AngularJS的特性

AngularJS主要有4大特点，MVC模式，数据的双向绑定，继承和模块化。

我们在开发的时候，可以使用MVC架构模式进行前台开发 ，这样有效的分离了视图展示层，服务层和控制层，降低了各模块之间的耦合，提高代码的复用性，也更易于后期的代码维护。

通过ng-model指令可实现视图展示层和控制层数据的双向绑定，页面数据发生改变，控制层数据也会改变，反之，页面也会随之进行渲染;

此外它还支持继承，只需要在当前controller的方法函数上传入一个$controller 内置对象，通过$controller传入父控制器名，和$scope : $scope,即可实现两控制器同用一个域对象，页面只需导入父控制器的js文件，即可完成继承，通过控制器间的继承，可提高代码的复用性;

模块化是指它可以将通用的数据操作进行包装起来，比如，数据的验证，全选和反选操作等，通过继承的方法使其可以调用，有效提高开发速度;

依赖注入也是它的一大特点，需要调用哪个服务，我们只需要在控制层的方法参数上进行声明，就可以拿来直接调用；

• 怎样使用AngularJS

当我们使用angularJS开发前台时，首先需要引入它的核心js文件，接着在HTML标签上使用指令ng-app和ng-controller分别定义它的应用范围和它的控制器,所有的指令只能在它的应用范围里被识别，所有的angularJs对象及函数也只能在它的控制器里被解析和调用。我们可以使用ng-init来进行数据的初始化，也可以通过函数进行多个数据的初始化，但是只能初始化一次。当我们需要往后台提交一些表单数据时，可以通过ng-model 指令定义变量与输入框进行绑定，并且在一个按钮上使用ng-click定义一个点击事件，我们就可以很方便的在控制层通过调用对应的方法，并且在方法内通过对应的变量名拿到输入框内的数据，调用对应的服务与后台完成交互。我们也可以把后台查询到的数据绑定到对应的对象上，通过前台进行渲染，如果是一个集合，我们可以使用 ng-repeat 遍历展示到页面上 ，也可以通过ng-options将数据依次显示在下拉框里。