最近在把玩AngularJS框架,之前也看过流行的Backbone,不过AngularJS给人的感觉完全不同,它走的是一条高帅富之路。

按照官方的说法,AngularJS是一套依赖注入的MVC开发套件。JavaScript本身不具备实现传统的“依赖注入”的条件,我觉得即便是实现传统的MVC模式,也很难做到优雅大方,因为作为View层的HTML DOM,不具备原生扩展性,浏览器的渲染器也没有提供底层的方法让我们可以将界面元素和业务逻辑关联起来,必须依靠代码去实现,AngularJS巧妙地解决了这些问题,而且姿势相当漂亮。

在我看来,AngularJS的设计思想和Flash平台上的Robotlegs有很多相似之处,将大量重复性的编码工作隐藏在框架中,让开发者只需要关注程序的业务逻辑和结构,自然地,开发效率得到了质的飞跃。

下面是文档中的一个简单例子:

<!doctype html>
<html ng-app>
<head>
<script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
</head>
<body>
<input ng-model="name">
<p>Hello {{name}}!</p>
</body>
</html>

短短几行代码(其实完全是HTML代码),实现了一个简单的捕获文本输入的功能。如果使用原生JavaScript或者jQuery工具库,首先要侦听input的事件,然后修改p节点的文本。这类代码毫无技术性可言,都是些重复的编码工作,现在,AngularJS把我们从琐碎的coding工作中解决出来了。

Flex开发者看了上面的例子,是不是觉得很眼熟?大家伙马上想到了MXML代码中的数据绑定。上面的例子中,使用双大括号围起来的写法,和MXML中的单大括号写法何其相似!!还必须指出的是,AngularJS实现的是双向数据绑定,即如果用代码修改了Model中的name属性,界面上也会同步更新。同志们,仅这个特性就能让我们在有限的编程生涯中少写多少行代码??

数据绑定是AngularJS的两大法宝之一,另外一个是依赖注入。为了实现依赖注入,AngularJS扩展了HTML DOM语法,添加了所谓的"directive",其实就是自定义 的HTML标记,比如上面代码中的ng-model属性。类似的还有不少,比如ng-app, ng-controller, ng-repeat, ng-click, ng-init, ng-class, ng-show, ng-hide...。为了解析这些自定义的标记,在DOM加载完毕后,AngularJS会遍历DOM树,根据定义的directive列表,对这些标记进行解析,如果有需要,会修改DOM节点,以及建立Controller, Model, 建立数据绑定等等。

除了内置的directive, AngularJS允许我们自定义directive。由于HTML代码中本身并没有包括任何的业务逻辑,只是将DOM节点和Controller, Model绑定在一起,这使得我们可以方便地编写自定义组件,从而提高代码的重用度。

和其他的开发框架相比,AngularJS稍显复杂,毕竟使用代码去扩展HTML语法,这听起来就是一个大工程。不过,对于使用者来说,完全可以不用太过理会其中复杂的实现,只需要关注应用本身的功能,这正是使用AngularJS的目的所在。

AngularJS框架速写的更多相关文章

  1. 十佳AngularJS框架

    您是否还在烦恼如何没有困难地创建一个创新型的Web应用程序?那么一定不要错过这个集合!在本文中,小编为大家收集了十个非常棒的AngularJS框架.AngularJS框架拥有大量有用的工具和组件,可以 ...

  2. 10 个非常有用的 AngularJS 框架

    AngularJS是最流行的开源web app框架.AngularJS被用于解决阻碍单页应用程序开发的各种挑战. 你作为一个AngularJS用户,却不知道一些可以帮助你美化编码的资源?那么一定不能错 ...

  3. AngularJS框架研究(一)

    和几年前相比,现在的Javascript开发方式有了翻天覆地的变化,一些极具创意的开发工具的出现,让前端开发更加成熟,Angular框架就是一个例子.最近在看Angular的源代码,发现并不是件容易的 ...

  4. 简洁AngularJS框架后台管理系统bootstrap后台模板

    最近在做一个后台管理的项目,但是没有设计图完全,所以就发现一款非常不错的模版. 这个模版是基于 AngularJS 和 bootstrap 的后台管理系统模版. Minovate是 AngularJS ...

  5. 关于js单页面实现跳转原理以及利用angularjs框架路由实现单页面跳转

    还记得我们刚开始学习html时使用的锚节点实现跳转吗? <a href="#target">我想跳转至目标位置</a> <p>第一条</p ...

  6. angularjs框架及其生态环境 --待续

    angular的MVVM框架结构:     1. app,   2.routes, config,   3.module,   4.Controller, $scope,controller参数,事件 ...

  7. vuejs angularjs 框架的一些比较(vue项目重构四)

    使用Angularjs和Vue.js对比 首先需要说明的是:现在默认angularjs指angular1.0+版本,angular默认指2.0以上版本.本文的名词也默认指定angular的1.0+版本 ...

  8. AngularJS 框架

    AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTML. [Angular JS表达式]  1.Angular JS使用双{{}}绑定方式.用于将表达式的内容输出到页面 ...

  9. 初探AngularJs框架(三)

    一.实现todoList的demo 功能很简单,提供一个文本框,用户输入回车后添加新条目.每个条目可以在待处理和处理中两个区域间切换,每个条目都可以被删除,大致的界面如下图所示: 二.处理逻辑 首先将 ...

随机推荐

  1. T4模版引擎之生成数据库实体类

    在通过T4模版引擎之基础入门 对T4有了初步印象后,我们开始实战篇.T4模板引擎可以当做一个代码生成器,代码生成器的职责当然是用来生成代码(这不是废话吗).而这其中我们使用的最普遍的是根据数据库生成实 ...

  2. crawler_URL编码原理详解

    经常写爬虫的童鞋,难免要处理含有中文的url,大部分时间,都知道url_encode,各个语言也都有支持,今天简单整理下原理,供大家科普 1.特征: 如果URL中含有非ASCII字符的话, 浏览器会对 ...

  3. JavaWeb显示器

    本文研究的总结.欢迎转载,但请注明出处:http://blog.csdn.net/pistolove/article/details/44310967 A:监听器的定义      专门用于其它对象身上 ...

  4. 【百度地图API】——如何让标注自动呈现在最佳视野内

    原文:[百度地图API]--如何让标注自动呈现在最佳视野内 摘要: “我有一堆标注,不规则的散落在地图的各个地方,我想把它们展示在一个最佳视野中,怎么办呢?”一位API爱好者咨询道. -------- ...

  5. MSSQL发现第五到数据的第十

    第二十数据查询数据库,第十条数据,两起案件: 1,ID是连接的,当然这样的情况比較好查.直接SELECT就能够了.取ID大于5小于10就能够了, 这样的情况比較少. 2.ID不是连接的.假设要取第五条 ...

  6. android 卸载程序、清除数据、停止服务用法

    要实现卸载程序.清除数据.停止正在执行的服务这几大模块,如今将代码粗略总结例如以下: 主要运用到的类有 PackageManager ActivityManager ApplicationInfo R ...

  7. 从WebBrowser中取得Cookie 和 WebClient设置cookie!

    原文:从WebBrowser中取得Cookie 和 WebClient设置cookie! 从WebBrowser中取得Cookie 的代码 CookieContainer myCookieContai ...

  8. UIApplicationMain方法介绍

    在IOS程序的main函数中执行了一个UIApplicationMain这个函数,下面介绍以下这个函数的作用. int UIApplicationMain(int argc, char *argv[] ...

  9. vistual studio 2012 安装失败,提示Microsoft Vistual Studio 2012 Devenv找不到元素,等错误信息

    在安装vistual studio 2012过程中,出现安装失败,提示Microsoft Vistual Studio 2012 Devenv找不到元素,等错误信息 解决方法是更新相应的server补 ...

  10. 批量执行SQL文件

    原文:批量执行SQL文件 摘要:很多时候我们在做系统升级时需要将大量的.sql文件挨个执行,十分不方便.而且考虑到执行顺序和客服的操作方便性,能不能找到一种简单的方法来批量执行这些sql文件呢? 主要 ...