AngularJS小结

AngularJS早些时候有过了解，知道这是一个JS的MVC框架，同类型的框架还有Backbone等。这次是由于项目需要，学习了两天的Angular后开始着手改之前的项目代码，这里大概说一下这一周学习Angular的心得体会吧。

      首先，使用Angular最大的感受就是它的设计思路完全不同于Jquery，jquery更倾向于对Dom的操作；而使用Angular则需要你有一个全局的认识，你必须知道你想要做成什么样子才可以下手去做，所以我感觉ng对前端开发的要求比jquery要高一些。先来看看Angular的一些特点：

       一、MVC模式

      MVC顾名思义：Model-view-Controll设计模式，其实这个有点类似于Java的思想，模型、视图、控制器的分离。但是Angular又有点不同于传统的MVC，严格意义上说它是MVVM（model-view-view-Model）。Model是简单的javascript对象；ViewModel是$scope对象，Angular靠$scope检测状态变化；Controller负责设置初始状态和参数化$scope方法用以控制行为；View是Angular解析渲染后生成的HTML。

       二、数据双向绑定

      这应该算Angular比较特有的属性，概括来说，Angular通过监听变量的变化来实现双向数据绑定。传统技术上，当model改变时，开发与人员需要手动处理DOM元素并将属性反映到变化中。而在Angular中，程序员可以轻轻松松解决这种问题，省掉了很多的代码。

       三、模板

      在Angular中，一个模板就是一个HTML文件。但是HTML的内容扩展了，包含了很多帮助你映射到Model到View的内容。

       四、服务和依赖注入

      Angular服务的作用就是对外提供某个特定的功能。Angular拥有内建的依赖注入（DI）子系统，可以帮助开发人员更容易开发，理解和测试应用。

       五、指令

      指令比较有意思，可以帮助我们做很多的事情。很多的DOM操作，比如增删改查都可以用指令完成。指令自带的link方法有三个参数：scope、element、attrs。通过这三个参数我们可以完成很多功能，这也是我用的比较多的方法。

      简单介绍了Angular的特性，下面说说我对这个项目的一些想法。

      我对该项目的理解就是普通的用户登录，进入到主页面后可以通过搜索PID或者FID搜到一些POI，用户可以查看这些具体地址的详情。数据传递是JSON，异步请求。要说复杂的话，那就是对于openlayer的使用吧。

      这是一个很传统的jquery项目，但是如果想要把此项目改成Angular成本比较高，最大的原因是因为项目页面少，main.html和poiInfo.html的js操作耦合性太高，我们都知道Angular是一个前端MVC框架，对于高耦合的页面很难进行拆分。方法的调用和逻辑相对比较紧密，抽离不好就会出错。由于我接触Angular时间不多，项目实战经验匮乏，它的一些深入知识还是不太熟悉，如果重新进行开发担心有些功能无从下手。比如传统jquery的一些复杂的嵌套选择器，在Angular当中我有些无力。两个框架的思路不一样，在进行Angular使用时，面对DOM操作还是不能很好的转变过来，不能总想着获取dom然后进行操作，在ng中操作的应该是变量。通过变量改变视图，通过视图的改变，回馈到变量中，这才是Angular的精髓。