AngularJS

这是一个AngularJS Guide的中文分支版本，提供关于AngularJS的视频、入门、使用与论坛等中文互联网内容，这里的分类并没有完全参照英文版，也并不固定，如果你有发现新的内容需要添加新类别，直接加吧。

视频

• Angular教学视频youku转载

入门指南

• 使用AngularJS构建大型Web应用
• AngularJS入门教程
• AngularJS学习笔记

使用经验

• AngularJS开发一些经验总结
• 再谈AngularJS DI(Dependency Injection)
• Angularjs的IOC Inject分析
• 细说Angular ng-class
• AngularJS Controller 间通信机制
• AngularJS表达式-Expression
• AngularJS关于依赖和模块与amd/cmd的区别，分享下结合使用示例
• 搞懂 AngularJS 預設模組 select 標籤的 ngOptions 參數用法
• 如何讓 Visual Studio 2012 支援 AngularJS 的 Intellisense
• 如何组织大型JavaScript应用中的代码？

论坛

• AngularJS中文社区
• angulargirl

繁体中文翻译

学习AngularJS

译者: 这是jmcunningham/AngularJS-Learning的简体中文翻译 我会尽量依照原文翻译 某些专有名词就不另外翻译 如果翻译错误也请提出建议指教 希望大家可以帮忙提供更多更好的AngularJS学习资源 谢谢

这里提供一些学习AngularJS的部落格链接, 文章, 和影片. 这个列表还在持续成长中. 如果你有想提供的链接与资源, 欢迎提出pull request. 我也会尽量确认以下的资源是有用的(不是只有两段文字的灌水文). 如果你有更好的方法来分类这些资源, 请让我知道. 在一般主题分类中的类似文章, 我之后也会把他们另外分类出来.

注意：**开头的链接是讨论ANGULAR 1.2版的新功能. 许多人希望快速了解Angular 1.2版的新功能, 所以我也会在之后开出新的分类标题. 等内容整理差不多或者1.2版分类变得太大我再来编辑, 不过现在的话Angular 1.2链接可以在两处同时看到.

Angular 1.2 的新功能

• **AngularJS 1.2 & Beyond
• **Error Message Minification with MinErr
• **AngularJS路由的变化
• **AngularJS缺失的指令: Focus & Blur
• **Remastered Animation in AngularJS 1.2
• **Preparing for Animations in Angular 1.2.0
• **AngularJS 1.2中的5个超酷新特性
• **在AngularJS 1.2.0中使用ngAnimate替代jQuery.slideDown()
• **为AngularJS 1.2做好准备

书籍 Books

• AngularJS
• 立刻快速开发 AngularJS
• AngularJS 菜单
• AngularJS 在行动
• AngularJS For .Net 开发员
• AngularJS 浏览器应用程序开发
• 发现自己的 AngularJS 优势
• AngularJS Directives
• ng-book
• 打造你的AngularJS
• AngularJS依赖注入
• 通过Bootstrap和AngularJS学习Web开发
• AngularJS 设计模式
• AngularJS 网路应用开发蓝图
• 实用 AngularJS

影片 Videos

• Egghead.io — 44 videos of about 4 minutes each — source code
• 视屏教程: 60分钟教你 AngularJS 基础入门 — 1:10:50
• AngularJS YouTube 主页 — several videos, mostly presentations of 1h or more
• Angular JS 入门 — 50:05
• Angular JS 端对端测试 — 52:59
• Angular JS 安全性 — 29:45
• Grunt 和 Angular JS 前端开发流程 — 1:02:37
• AngularJS 教程 — 12:19
• AngularJS 秀 (Tekpub) — 8 videos (paid)
• 用 AngularJS 快速开发 Javascript 应用程序(Tuts+) — 22 videos of about 5 minutes each, in 8 sections (paid)
• AngularJS 基础入门 (Pluralsight) - 6 hours 15 minutes total (paid)
• **AngularJS 1.2 和未来
• AngularJS 实例 - Growing list of 5 minute or less videos
• 用 AngularJS 和 Firebase 开发实时程序
• MongoDB 和 AngularJS， MEAN 堆
• AngularJS, EmberJS 和 KnockoutJS 双向绑定的比较
• Angular最佳实践 - 64 videos(paid)
• Neosavvy的 Angular & Jasmine 视频系列 - 16 videos of about 2-3 minutes each
• AngularJS 视频集合 — Collection of Videos from Various websites.
• ng-conf YouTube 页面 — YouTube channel with all the presentations given at the Angular Conference in January 2014.
• 通过50个例子学习 Angular.js (第1部分)

在线课程 Courses

• Thinkster.io - 学习 AngularJS 更好的方法 - 免費的線上 AngularJS 課程
• AngularJS互动教程
• 和Dan Wahlin一起学习AngularJS
• Tuts+: 开始使用 Angular
• Code School Shaping Up with Angular.js
• Lynda Up and Running with AngularJS
• Codecademy AngularJs

帮助 Help

• StackOverflow
• AngularJS 邮件列表（谷歌小组）
• Chatroom （基于浏览器的在线聊天系统）
• AngularJS Google+的社区
• reddit

一般主题 General Topics

• AngularJS 速查表
• AngularJS 乐趣
• AngularJS Philly ETE 幻灯
• 随机技巧使用 AngularJS
• AngularJS 难倒我的是什么
• 5个理由在企业应用程序世界中使用 AngularJS
• 在 AngularJS 中实现延迟加载
• 用更多 AngularJS 魔力来大力增压你的浏览器应用程序
• HashKeyCopier - 一个 AngularJS 合并缓存和实时数据的实用工具类
• 在 AngularJS 中探索 Directive 指令，$scope，DOM 渲染和时序
• 在 AngularJS 资源上应用缓存的响应
• Angularytics: 在 SPA 中用 AngularJS 来跟踪页面访问量和事件的解决方案
• 在 AngularJS 上共享数据，状态和模型： 方案选择，比较和我的解决方案
• Angular.js 和 IE8 缓存
• AngularJS 和 SEO
• 模板，路由和共享数据视图之间的一个 AngularJS 的应用
• 用 AngularJS 改善最终用户体验
• AngularJS 控制器教程与实例
• HTML5 本地存储与 Angular JS
• 动态路由和 AngularJS 以及 Silex
• 在你的 AngularJS 应用中建模数据和状态
• AngularJS 代码重用
• 在 AngularJS 和 RequireJS 中动态加载控制器和视图
• 用AngularJS的orderby筛选器对多个字段用不同顺序排序
• $http 响应拦截器
• AngularJS: 先进的设计模式和最佳实践
• AngularJS 的自动 JSON 数据解析
• AngularJS 抽象：模块
• 在 AngularJS 中用 ngSwitch 和 ngSwitchWhen 来混合静态内容
• AngularJS 构建大型应用程序
• **错误信息与​​微小MinErr
• 如何让你的AngularJS 应用程序在IE8工作
• AngularJS 性能优化的长列表
• AngularJS 响应网站
• 在 AngularJS 减少初始化时间
• 用 Yeoman, Grunt 和 Bower快速开发 Angular 程序
• **AngularJS 1.2 准备
• 10个理由网页开发人员应该了解AngularJS
• AngularJS partials 的懒惰预取
• 让你加快速度 AngularJS 开发的资源
• 使用装饰提升 AngularJS $log
• 使用 AngularJS 和 Stacktrace.js 记录客户端错误
• AngularJS表单自动完成，并记住密码
• 优化AngularJS: 从1200ms到35ms
• 为AngularJS应用创建一个RequireJS服务
• 在你的应用开始后加载AngularJS组件
• 根据需求加载AngularJS模块
• 用Grunt来配置AngularJS环境
• 服务器在单页应用(SPAs)中的作用?
• 通过Websockets将Angular.js实时化
• 丰富的对象模型和Angular.js
• 丰富的对象模型和Angular: 一致性映射
• AngularJS中的障碍和实用例子
• 通过故事理解AngularJS路径
• 重构AngularJS
• Angular模型和javascript的类
• angularjs控制器的状态
• 怎么使用AngularJS的ngMessages
• 深度挖掘Angular的控制器
• AngularJS自定义过滤器
• 理解Angular的$scope和$rootScope事件系统中的$emit,$broadcast和$on
• AngularJS无阻碍数据预载

介绍/开始学习 AngularJS

• AngularJS 入门
• 你需要开始了解的 AngularJS 的一切
• 要成为 AngularJS 专家必备的知识
• 5个很棒的 AngularJS 功能
• AngularJS for jQuery 开发者
• AngularJS 入门指南
• 用 AngularJS 从头开始写应用程序
• AngularJS: 概述
• AngularJS教程 - 建立一个应用程序使用的指令和数据绑定
• 在30分钟内教会你 AngularJS
• 用 Yeoman, Grunt 和 Bower 快速开发
• 10个你需要开始用 AngularJS 的理由
• AngularJS 筛选器
• 一天学会 AngularJS
• 7 种成功学习Angular的方法
• 用Node and Angular创建单页应用
• 通过 5 个实例学习Angular
• 考虑的AngularJS的效率
• Environment Specific Configuration in AngularJS Using Grunt
• 用装饰来提升Angular日志
• Picking Up Angular, build a twitter-like application
• AngularJS网页应用的异常处理
• AngularJS 101: 从0开始学 Angular

使用及学习心得 Lessons Learned

• 经验教训：一年一个大AngularJS项目
• 一些AngularJS陷阱
• 我希望我事先被告知关于 Angular.js 的事实
• 我希望我当时就知道我现在知道的东西 — 我和AngularJS
• 如何建立一个大型Angular.js应用
• 对新手和全能好奇的开发人员的 AngularJS 提示和技巧

分段式文章 Multipart Articles

• 开始使用elasticsearch和AngularJS: Part1 - 搜索, Part 2: Faceting, Part 3: Visualization
• 用AngularJS开发可维护网络应用: Part 1, Part 2
• Google,Twitter和AngularJS: 1: Google, Twitter, and AngularJS, 2: Let’s Make a Feed Reader, 3: 生成源, 4: 管理源, 5: 测试, 6: 增加依赖, 7: 表格验证, 8: 迭代程序 & 过滤器, 9: 安装
• 用AnuglarJS打造 SignalR Stock Ticker: Part 1, Part 2
• AngularJS 最佳实践: 我之前都做错了!: Part 1, Part 2, Part 3
• AngularJS简介 Part 1, Part 2
• 深入AngularJS : Part 1, Part 2: 过滤器
• The 7 成为Angularjs大师, Part 2: Scopes, Part 3: 双向绑定, Part 4 and 5: Expressions and directives, Part 6: 服务
• AngularJS 概况: 1:开始 AngularJS编程, 2:创造 一个 AngularJS 控制器, 3: AngularJS $scope 不是MVC 模型, 4:在 AngularJS中重复使用元素, 5: 在一个 AngularJS ngRepeat 元素中过滤数据, 6:用 #AngularJS 表格控制器来控制表格提交, 7:创造 #AngularJS Directive, 8:在一个 AngularJS 应用中使用DOM
• 打造一个基于MongoDB, ExpressJS, AngularJS, 和 Node.js的Google日历订阅App Part 1
• 创造组建: Part 1: 30秒将jQuery转成AngularJS, Part 2: AngularJS Directive 控制器

范例应用程序 Sample Apps

• 建有AngularJS购物车应用程序
• 用谷歌feed API 和 AngularJS建立一个 feed 阅读器

Scopes & Compile

• AngularJS 和 scope.$apply
• AngularJS 什么是范围原型/原型继承的细微之处？
• angularjs.org watch, on pub sub, 和你.
• AngularJS 中使用 Ng-bind
• In AngularJS 中解除绑定 $watch() Listeners
• 使用AngularJS 对DOMZ中的 $scope 进行访问
• 指令链路, $observe, 和 $watch 功能在AngularJS语境执行的内部
• Hailing All Frequencies – 在 AngularJS 用 Pub / Sub 设计模式进行内部沟通
• AngularJS 嵌套作用域
• AngularJS: 6个常见的使用作用域的陷阱
• Scoping AngularJS Directives: Part 1, Part 2
• $watch $apply 是怎么运行 $digest 的
• AngularJS: $watch, $digest 和 $apply
• 删除不需要的 Watches
• Angular - $compile: 它是如何工作，如何使用它。
• 通过实例来了解 Angular.js $scope
• 在AngularJS控制器之间共享状态

依賴注入 Dependency Injection

• AngularJS依赖注入背后的魔法
• AngularJS: 更多关于依赖注入
• Angularjs 依赖注入
• 在 AngularJS 中配置依赖注入
• 在AngularJS依赖注入框架中定义实例化的类

指令 Directives

• AngularJS指令和JavaScript的计算机科学
• AngularJS指令 - 特定于域的扩展为HTML
• AngularJS指令教程
• Commentable： AngularJS 的多态嵌套注释指令
• AngularJS的ngForm指令
• 执行指令后，DOM完成渲染
• 使用AngularJS指令的案例
• 我的方法来构建绑定到JavaScript的事件的 AngularJS指令
• AngularJS 委派嵌套指令行为转到父指令
• AngularJS 探索指令控制器，编译，链接和优先级
• AngularJS 在指令中使用控制器
• Angular.js 使用JSON参数的指令
• 指令的漫游指南
• 创建一个简单的AngularJS指令
• 扩展的HTML AngularJS指令
• Angular 嵌套递归指令
• AngularJS一个全功能于一身的指令控制器
• 平了 AngularJS 的战场: 构建可重用点击编辑指令
• AngularJS 覆盖标准的HTML标签的指令
• AngularJS 移动滑块指令
• 在AngularJS中使用命名空间一次性指令
• AngularJS 和 $compile
• 深度了解指令
• AngularJS: 引用父作用域的指令
• 提示：具有相同的名称的指令
• 将数据移入一个AngularJS指令
• 构建自定义 AngularJS 指令的独特价值
• 从现有的插件/脚本之一创建 AngularJS 指令
• Angular.js指令 - 控制器和链路之间的区别
• AngularJS指令教程
• AngularJS指令设计一点通
• 重构 AngularJS 指令

服务/供应商 Services/Providers

• Angular service 还是 factory?
• 如何在4种不同的方式创建 （Singleton） AngularJS服务
• Angular JS 中移动AJAX调用到定制服务
• 消费服务
• 了解服务的类型
• 理解 angular $http 拦截器
• 在 AngularJS 中 provider 供应商之间的差异
• Angular 的模块：工厂服务，服务，价值，噢，我的天啊

路由 Routing

• 如何在AngularJS Web应用程序中推迟路由定义
• AngularJS UI路由器状态管理
• AngularJS 嵌套视图，路由和深层链接
• Angular UI 路由器
• AngularJS 使用UI路由器基础
• **AngularJS 路由变化

承诺/递延 Promises/Deferred

• 加强 Angular 承诺: 从当初的诺言的结果中返回字段或方法的新的承诺
• AngularJS 承诺，或在AngularJS处理异步请求
• 在 AngularJS 中利用 Futures
• 在 AngularJS 视图中使用承诺
• 使用 AngularJS 承诺
• 只有在所有的承诺都解决了再显示路由

表单 Forms

• AngularJS 表单验证
• AngularJS指令来测试密码强度
• AngularJS 指令来检查密码是否匹配
• 在 AngularJS 选择菜单中混合静态和动态数据
• Angular.js: ng-select 和 ng-options
• Angular.js: 用 $watch和 blur自动完成和启用表单
• 创建AngularJS指令在表格中来删除重复的代码
• In AngularJS 在指令中强制重绘会导致意外滚动
• 在 AngularJS 中使用 ngOptions
• 用 Angular JS 验证表单显示大量验证消息
• 在AngularJS应用程序管理文件上传的指令
• AngularJS 单选按钮
• AngularJS Referece 当前的 FormController
• 在AngularJS 中监听变化的验证
• A Select $watch() 教我关于 ngModel 和 AngularJS
• 最前沿的：高级AngularJS表单验证
• Twitter Bootstrap control-group directive for AngularJS
• 在AngularJS 中防止重复的请求
• AngularJS 缺少的指令：原表单复位
• **AngularJS 缺少的指令：焦点和模糊
• Angular JS: 重复验证表单元素
• Angular JS: 通过指令自定义验证
• Angular JS: 表单验证
• 深入学习表单验证
• Ng-model 和自定义表单验证
• Angular JS Ajax 下拉菜单，日期选择器和保存数据
• AngularJS 表单的概念

认证 Authentication

• AngularJS Web 应用程序处理用户身份验证
• Angular.js 单页应用程序验证
• AngularJS – 快速的基于角色的认证
• 单页应用验证

Collections (& ngRepeat Stuff)

• 使用 AngularJS 继承来的Collection
• 在 AngularJS 中 添加 ngRepeat 列表分隔符
• 在 AngularJS 中分组嵌套 ngRepeat 列表
• 在 AngularJS 中使用 ngController 和 ngRepeat
• 在 AngularJS 中通过 ngRepeat 渲染DOM元素

原始码组织架构 Code Organization

• 用 AngularJS 开发超大的应用程序
• 大 AngularJS 和 JavaScript 的应用的代码组织
• Angular 应用程序的网页结构构想
• 如何组织一个普通 Web 应用程序： 编码 AngularJS 的正确方法。基本示例
• AngularJS 模块
• ngDefine: AngularJS & RequireJS
• 模块化AngularJS应用设计
• 在 AngularJS DI 中使用 RequireJS

测试 Testing

• 用 AngularJS 和 Testacular 进行全频谱测试
• 在单元测试中 Mocking 承诺
• 如何测试AngularJS指令
• 用 Jasmine 单元测试 AngularJS 控制器
• 使用 QUnit 和 Sinon 单元测试 AngularJS 控制器
• 测试 AngularJS Directive： 处理外部模板
• 如何进行 Angular 应用程序的单元测试
• 单元测试 - 指令 Directives
• 单元测试 - 服务
• 单元测试 - 控制器
• 在JavaScript 和 AngularJS 中 mock 服务器依赖性
• AngularJS 先进的测试和调试的
• AngularJS 单元测试的最佳实践
• 在 AngularJS 中装饰你的测试

RESTful Stuff

• 在 AngularJS 资源中使用 REST 风格的控制器
• Restangular: 新AngularJS框架来适当地，轻松地处理 REST API REST 风格的资源
• Restangular 新功能: 针对 Angular的终极 REST API 客户端
• 使用 AngularJS 厂服务与 RESTful 服务实现互动
• 在 AngularJS web应用程序中实现一个 REST 风格的 Web 服务身份验证

本地化 Localization

• Localizing Your AngularJS Apps
• Internazionalization (i18n) with AngularJS
• AngularJS And i18n

界面 UI Stuff

• Angular UI 套件（包括一些子项目）
• AngularJS 动画
• 在AngularJS增强的动画功能
• 可重复使用的 AngularJS 弹出的对话框中服务
• 在 AngularJS 中创建自定义显示/隐藏 Directive
• 在 Angular.js 中实现 Bootstrap Tabs
• 使用拦截器的响应显示和隐藏一个装载小工具
• 用 AngularJS 建立一个 Typeahead Directive
• AngularJS Modal 服务
• AngularJS 中实现交叉衰落图像
• AngularJS 和 SVG
• AngularJS: 滚动动画
• AngularJS 动画
• 用 AngularJS 实现拖放文件上传
• **在 AngularJS 1.2 中重新掌握动画
• Angular JS - 通过ID滚动到某个元素
• 构建 AngularJS 对话服务
• **在 Angular 1.2.0 中准备使用动画
• **在 AngularJS 1.2.0 中用 ngAnimate 替换 jQuery.slideDown()
• AngularJS: 模糊图像 directive
• 使用AngularJS，Ajax和 Bootstrap 3 来建立一个“加载更多”小工具

整合其他语言/框架 Integration With Other Languages/Frameworks

• AngularJS 和 TypeScript
• 用 AngularJS 和 D3 来建立一个 WordCloud Directive
• 在 AngularJS 中用 jQuery Event Delegation
• Hooking up ASP.NET SignalR with Angular JS
• 在你的 AngularJS 应用程序进行 Facebook 的身份验证
• 用 Yeoman, Grunt & Bower 来全面自动化你的 Angular 开发过程
• 用 Bower 编写可重用的 AngularJS 组件
• 用 ngularJS 开发谷歌地图的组件
• 无需服务器来通过 PouchDB 来同步多个 AngularJS 应用程序
• 用 AngularJS 和 PouchDB构建离线应用
• 如何AngularJS和Rails集成4

后端代管 Hosted Backends

• Parse.com boilerplate 建设大型，复杂 AngularJS 应用
• 用 Firebase用于 Angular 应用程序的实时数据库
• 用 Backlift开发针对 Angular 的 CRUD 后端
• 用 AngularJS 和 PouchDB 构建离线应用
• 用 DreamFactory 开发 针对 Angular 的 CRUD 后端
• Firebase 和 Angular 三个双向数据绑定

移动装置 Mobile

• PhoneGap+AngularJS 快速入门指南
• 用 AngularJS 开发 PhoneGap 引用程序
• PhoneGap 和 AngularJS: In App Browser
• PhoneGap 和 AngularJS: Notification Service
• 用 Phonegap, AngularJS 和 ExpressJS 开发移动程序第一部分

编译器 Text editor bundles/IDE Stuff

• Sublime text 2 包
• VIM UltiSnip & Snipmate AngularJS 代码片段
• 在 WebStorm 7 中运行 Javscript 测试
• Visual Studio

开发工具

• AngularJS Batarang Chrome 浏览器扩展
• 从JSON或者 restful API生成 JavaScript 和 HTML，使用 AngularJS 和 JQuery

Donate

×Close

Donate Me

Thanks for your support!

• Alipay
• Wechat

Close

Share: