文档章节

AngularJS 2014-10-22

jayronwang
 jayronwang
发布于 2014/10/22 16:28
字数 586
阅读 409
收藏 8

前台代码起来越多,需要用一种更高效方式整合

MVC只是手段,终极目标是模块化和复用



第一部分:快速上手

1.1 感受AngularJS的4大核心特性

1.2 搭建开发、调试、测试环境

第二部分:基本概念和用法

2.1 MVC

2.2 模块化与依赖注入

2.3 双向数据绑定

2.4 指令

2.5 Service

2.6 Provider

2.7 表单

2.8 综合实例BookStore

第三部分:核心原理解析

3.1 Parser

3.2 双向数据绑定

3.3 依赖注入

第四部分:ng控件开发

4.1 用AngularJS改写jQuery控件

4.2 angularjs-ui

4.3 移动控件库ionic

第五部分:TDD前端自动化测试

5.1 TDD

5.2 详解Jasmine与Pracotor




tool:

http://www.oschina.net/p/angularjs-eclipse


module:

Jasmine


resource:

官方教程

http://woxx.sinaapp.com/

种子项目

https://github.com/angular/angular-seed

开源中国的 AngularJS 优秀文章汇总

http://www.oschina.net/news/54687/oschina-angular-articles-summary


http://jingyan.baidu.com/article/90895e0fb3495f64ed6b0b50.html

开发、调试、测试工具

代码编辑工具 - sublime 轻量级,建议使用

http://my.oschina.net/jayronwang/blog/287242  安装插件

代码编辑工具 - webstrom 重量级,功能强大

安装插件

断点调试工具 - chrome插件Batarang  针对angularjs进行调试

版本管理工具 - git + torgoisegit

http://msysgit.github.io/ git

http://download.tortoisegit.org/tgit/1.8.11.0/ torgoisegit


开发和调试工具 NodeJS

nodejs.org下载->安装->bin配置到环境变量

dos>npm install grunt

http://blog.csdn.net/zljjava/article/details/38824581 Error: ENOENT,

备:http://ibruce.info/2013/12/05/green-node-and-npm/ nodejs绿色版

代码合并和混淆工具 - Grunt

dos>grunt watch 每次修改文件就不用执行命令,grunt会自动监控


依赖管理工具 bower(相当于Java的maven) 如果开发时第三方插件不多,可以不使用,因为可以带来配置上的麻烦

dos>npm install jquery

dos>npm install bootstrap

dos>nmp uninstall jquery


轻量级server - http server 基于nodejs的简单服务器,可以将任一目录变成服务。用于后台未开发完,如进行简单的json模拟  

或者直接用apache

dos>http-server


单元测试runner - karma

karma-coverage运行覆盖率工

单元测试工具 - jasmine (相当于java的junit)

dos>karma start

专门为AngularJS定制的测试工具 - Protractor

dos>npm run protractor


第二部分:基本概念和用法

2.1 MVC


Angularjs的MVC是借助于$scope实现

$rootScope根作用域

firefox插件,查看scope,Inspect Angular Scope


2.2 路由,模块,依赖注入

ngRoute 路由


© 著作权归作者所有

下一篇: java 技巧
jayronwang
粉丝 15
博文 105
码字总数 20353
作品 0
厦门
私信 提问
OSChina 技术专题之 AngularJS 更新版(201412)

Angular JS (Angular.JS) 是一组用来开发Web页面的框架、模板以及数据绑定和丰富UI组件。它支持整个开发进程,提供web应用的架构,无需进行手工DOM操作。 AngularJS很小,只有60K,兼容主流浏...

OSC编辑部
2014/10/17
11.1K
26
给 Web 开发者的 25 款最有用的 AngularJS 工具

AngularJS 是一种新 JavaScript 框架,目的是降低要求,加快开发速度。AngularJS 是让 HTML 标记动态,使其对 web 开发者更有帮助,同时从大量的分段中给定一个标准结构,使开发速度更快更高...

oschina
2015/03/05
67.5K
19
Angular.js 相关记录

AngularJS作用域文档:http://docs.angularjs.org/api/ng.$rootScope.Scope ng-view 指令的角色是为当前路由把对应的视图模板载入到布局模板中。 AngularJS内置过滤器:http://code.angular...

彭博
2014/04/25
0
2
为处理升级过程的问题 Angular 5 将会推迟发布

开发团队目前公布的 Angular 5 发布日期是 10 月 23 日,该版本的重点是构建渐进式的 Web 应用程序(Progressive Web Apps)。 Angular 5 是由谷歌开发的流行 JavaScript 框架的下一个版本,原...

局长
2017/09/19
1K
15
AngularJS 和 Polymer 的角色,是否有竞争关系

AngularJS 2.0 一个关键的特性就是支持 Web Components。而 Google 的 Polymer 就是一个 Web Component 技术的实现,同时也是一个基于 Web Components 的框架。那么 AngularJS 和 Polymer 之...

oschina
2014/07/26
9.4K
18

没有更多内容

加载失败,请刷新页面

加载更多

axios 使用步骤很简单,首先在前端项目中,引入 axios:

  前端网络访问,主流方案就是 Ajax,Vue 也不例外,在 Vue2.0 之前,网络访问较多的采用 vue-resources,Vue2.0 之后,官方不再建议使用 vue-resources ,这个项目本身也停止维护,目前建...

SEOwhywhy
15分钟前
1
0
c++ 创建对象的三种方法

c++有三种方法创建对象 结合代码来看 1 #include <iostream> 2 using namespace std; 3 class Test { 4 5 private: 6 public: 7 add() 8 { 9 ......

天王盖地虎626
29分钟前
0
0
ant 中的fileset include等拷贝

拷贝一个目录到指定目录下 例:<copy todir="${basedir}/new"> <fileset dir="${basedir}/old"> <include name="appgen" /> <include name="appgen/" /> <include name=appgen/**" /> <incl......

shzwork
35分钟前
2
0
react-jianshu项目的创建

创建项目 1、github上创建仓库react-jianshu 2、将项目克隆到本地git clone git@github.com:startjcu/react-jianshu.git 3、在当前目录(项目目录的上级目录)下执行create-react-app react-...

星闪海洋
44分钟前
2
0
OSChina 周二乱弹 —— 小哥哥,你可以教我写代码吗

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @nnnm: 生活大爆炸,结束了,这部陪伴了漫长时间的情景喜剧,最终是以诺贝尔奖和大团圆收尾的。虽然,不算精彩,但也是温馨。而少年谢尔顿的...

小小编辑
今天
564
12

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部