AngularJS 是一个为动态WEB应用设计的结构框架。它能让你使用HTML作为模板语言,通过扩展HTML的语法,让你能更清楚、简洁地构建你的应用组件。

它的创新点在于,利用 数据绑定 和 依赖注入,它使你不用再写大量的代码了。这些全都是通过浏览器端的Javascript实现,这也使得它能够完美地和任何服务器端技术结合。

AngularJS的“禅道(理念)”

Angular信奉的是,当组建视图(UI)同时又要写软件逻辑时,声明式的代码会比命令式的代码好得多,尽管命令式的代码非常适合用来表述业务逻辑。

将DOM操作和应用逻辑解耦是一种非常好的思路,它能大大改善代码的可调性;

将测试和开发 同等看待是一种非常非常好的思路,测试的难度在很大程度上取决于代码的结构;

将客户端和服务器端解耦是一种特别好的做法,它能使两边并行开发,并且使两边代码都能实现重用;

如果框架能够在整个开发流程里都引导着开发者:从设计UI,到编写业务逻辑,再到测试,那对开发者将是极大的帮助;

“化繁为简,化简为零”总是好的。

AngularJS能将你从以下的噩梦中解脱出来:

使用回调: 回调的使用会打乱你的代码的可读性,让你的代码变得支离破碎,很难看清本来的业务逻辑。移除一些常见的代码,例如回调,是件好事。

大幅度地减少你因为JavaScript这门语言的设计而不得不写的代码,能让你把自己应用的逻辑看得更清楚。

手动编写操作DOM元素的代码:操作DOM是AJAX应用很基础的一部分,但它也总是很“笨重”并且容易出错。

用声明的方式描述的UI界面可随着应用状态的改变而变化,能让你从编写低级的DOM操作代码中解脱出来。绝大部分用AngularJS写的应用里,开发者都不用再自己去写操作DOM的代码,不过如果你想的话还是可以去写。

对UI界面读写数据: AJAX应用的很大一部是CRUD操作。一个经典的流程是把服务端的数据组建成内部对象,再把对象编成HTML表单,用户修改表单后再验证表单,

如果有错再显示错误,然后将数据重新组建成内部对象,再返回给服务器。这个流程里有太多太多要重复写的代码,使得代码看起来总是在描述应用的全部执行流程,而不是具体的业务逻辑和业务细节。

开始前得写大量的基础性的代码: 通常你需要写很多的基础性的代码才能实现一个“Hello World”的应用。用AngularJS的话,它会提供一些服务让你很容易地正式开始写你的应用,

而这些服务都是以一种Guice-like dependency-injection式的依赖注入自动加入到你的应用中去的,这让你能很快的进入你应用的具体开发。特别的是,你还能全盘掌握自动化测试的初始化过程。

良好的项目架构方式,如下:

Angularjs的模块化思想:首先创建一个module,其他指令附着其上。如下图所示:

下图为Angular的内核结构:

ng官方推荐的模块切分方式,如下图所示:

跨平台移动APP开发进阶(四)AngularJS简介的更多相关文章

  1. 跨平台移动APP开发进阶(二)HTML5+、mui开发移动app教程

    前端开发APP,从HBuilder开始~ 序 通过 HTML5 开发移动App 时,会发现HTML5 很多能力不具备.为弥补HTML5 能力的不足,在W3C 中国的指导下成立了www.HTML5Plu ...

  2. 跨平台移动APP开发进阶(一)mui开发注意事项

    mui开发注意事项 Mui HTML5开发框架 mui是一个高性能的HTML5开发框架,从UI到效率,都在极力追求原生体验:这个框架自身有一些规则,刚接触的同学不很熟悉,特总结本文:想了解mui更详细 ...

  3. 跨平台移动APP开发进阶(三)hbuilder+mui mobile app 开发心酸路

    注:请点击此处进行充电! 1.问题描述:在实现图片轮转时,若将 <script type="text/javascript"> mui("#slider&qu ...

  4. 带你从零学ReactNative开发跨平台App开发(四)

    ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...

  5. 网站开发进阶(四十四)input type="submit" 和"button"的区别

    网站开发进阶(四十四)input type="submit" 和"button"的区别   在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写ja ...

  6. 网站开发进阶(四十三)html中,路径前加“/” 与不加“/”的区别

    网站开发进阶(四十三)html中,路径前加"/" 与不加"/"的区别 前言 <script src="js/downloadify.js&quo ...

  7. 网站开发进阶(四十二)巧用clear:both

    网站开发进阶(四十二)巧用clear:both 前言 我们在制作网页中用div+css或者称xhtml+css都会遇到一些很诡异的情况,明明布局正确,但是整个画面却混乱起来了,有时候在IE6下看的很正 ...

  8. Ionic APP-Web SPA开发进阶(一)AngularJS全栈工程狮进阶

    AngularJS全栈工程狮进阶 前言 学习了一段时间AngularJS,开始接触移动端APP开发.为了响应公司开发需求,采用"Hybrid"混血开发方法.采用Ionic前端框架, ...

  9. iOS开发进阶--1.多线程简介

    学习是由已知的知识模型推理未知的知识模型的的过程. 本文适合学习完objective-c基础,想进一步提高做iOS开发的同学阅读. 在说线程的时候,我们先看看进程. 1.进程 每一个运行在系统中的应用 ...

随机推荐

  1. PHP 5 String 函数

    PHP 5 String 函数 PHP String 函数是 PHP 核心的组成部分.无需安装即可使用这些函数. 函数 描述 addcslashes() 返回在指定的字符前添加反斜杠的字符串. add ...

  2. 配置 docker0 网桥

    Docker 服务默认会创建一个 docker0 网桥(其上有一个 docker0 内部接口),它在内核层连通了其他的物理或虚拟网卡,这就将所有容器和本地主机都放到同一个物理网络. Docker 默认 ...

  3. 《An Introduction to Signal Smoothing》译文

    最近在做数据平滑相关的工作,正好读到该篇博客,感觉不错,就翻译了一下.原链接:An Introduction to Signal Smoothing 信号平滑简介 噪声无处不在,不管是在采集手机游戏的 ...

  4. ROS机器人程序设计(原书第2版)补充资料 (玖) 第九章 导航功能包集进阶 navigation

    ROS机器人程序设计(原书第2版)补充资料 (玖) 第九章 导航功能包集进阶 navigation 书中,大部分出现hydro的地方,直接替换为indigo或jade或kinetic,即可在对应版本中 ...

  5. CRM 2013 Script Loading Deep Dive

    关于CRM中脚本的加载次序梳理的很不错,可以看看 https://community.dynamics.com/crm/b/develop1/archive/2013/11/02/crm-2013-s ...

  6. linux源码编译安装OpenCV

    为了尽可能保证OpenCV的特性,使用OpenCV源码编译安装在linux上.先从安装其依赖项开始,以ubuntu 14.04.X为例讲解在Linux上源码编译安装OpenCV,其他linux版本可以 ...

  7. FFmpeg的HEVC解码器源代码简单分析:CTU解码(CTU Decode)部分-TU

    ===================================================== HEVC源代码分析文章列表: [解码 -libavcodec HEVC 解码器] FFmpe ...

  8. TCP连接建立系列 — 客户端发送SYN段

    主要内容:客户端调用connect()时的TCP层实现. 内核版本:3.15.2 我的博客:http://blog.csdn.net/zhangskd connect的TCP层实现 SOCK_STRE ...

  9. [ExtJS5学习笔记]第十七节 Extjs5的panel组件增加accodion成为折叠导航栏

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/39102335 官方例子:http://dev.sencha.com/ext/5.0.1 ...

  10. hbase 程序优化 参数调整方法

    hbase读数据用scan,读数据加速的配置参数为: Scan scan = new Scan(); scan.setCaching(500); // 1 is the default in Scan ...