随笔分类 - AngularJS
摘要：在很久很久以前，一位前辈向我推荐AngularJs。但当时我没有好好学习，仅仅是讲文档浏览了一次。后来觉醒了……于是下定决心好好理解这系列的文档，并意译出来（英文水平不足……不能说是翻译，有些实在是看不懂，希望大家在参观的过程中指出其中的错误）。经过1个多月断断续续的努力，终于把Guide里面的文章
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.unit-testing javascript是一门动态类型语言，这给她带来了很强的表现能力，但同时也使编译器几乎不能给开发者提供任何帮助。因为这个原因，我们感受到编写任何javascript代码都必须有一套强大完整的测试。angular拥有许多功能，让我们更加容易地测试我们的应用。我们应该没有借口不去写测试（这个嘛……）。一、 It is all about NOT mixing concerns（全部都关于避免代码关系变得复杂……） 单元测试，正如名称那样，是关于测试单个“单元”的代码。单元测..
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.services.managing_dependencies angular允许service将其他service声明为依赖，使用在自身实例化时使用的构造函数中。 为了声明依赖，我们需要在工厂方法声明中指定它们，并且在工厂方法中通过$inject属性（字符串标识数组）或者使用array notation。 通常$inject属性声明可以被丢弃（即http://www.cnblogs.com/lcllao/archive/2012/10/16/2726967.html中提到的隐式依赖注入，但这个是...
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.services.injecting_controllers 把service当作被依赖的资源加载到controller中的方法，与加载到其他服务中的方法很相似。 由于javascript是一个动态语言，DI不能弄明白应该通过static types（like in static typed languages）注入哪一个service。因此，我们需要通过$inject属性指定service名称， 它是一个包含需要注入的service名称的字符串数组。service ID顺序的重要性：工厂方法中的..
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.services.creating_services 虽然angular提供许多有用的service，在一些特别的应用中，我们会发现编写自定义service是很有用的。如果我们想做这件事，我们首先要在module中注册一个service工厂方法，可以通过Module.factory api（http://docs.angularjs.org/api/angular.module）或者在module配置方法中直接通过$provide api（http://docs.angularjs.org/api/.
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/dev_guide.services.$location一、Whatdoesitdo? $location服务分析浏览器地址栏中的URL（基于window.location），让我们可以在应用中较为方便地使用URL里面的东东。在地址栏中更改URL，会响应到$location服务中，而在$location中修改URL，也会响应到地址栏中。 $location服务：暴露当前浏览器地址栏的URL，所以我们可以注意和观察URL改变URL当用户做以下操作时，与浏览器一起同步URL：改变地址栏单击后退或者前..
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angulartemplate是一个声明规范，与model、controller的信息一起，渲染成用户在浏览器中所看到的视图。它是静态的DOM，包括HTML、CSS、angular特别的元素和angular指定的元素属性。angular元素和属性指示angular去扩展行为以及将templateDOM转换为动态视图的DOM。 下面是我们可以在template中使用的angular元素已经元素属性的类型：Directive（http://www.cnb..
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.e2e-testing 当一个应用的复杂度、大小在增加时，使得依靠人工去测试新特性的可靠性、抓Bug和回归测试是不切实际的。 为了解决这个问题，我们建立了Angular Scenario Runner，模仿用户的操作，帮助我们去验证angular应用的健壮性。一、 总括 我们可以在javascript中写情景测试（scenario test），描述我们的应用发生的行为，在某个状态下给与某些互动。一个情景包含一个或者多个”it”块（我们可以将这些当作对我们应用的要求），依次由命令（command）...
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular中，controller是一个javascript函数（type/class），被用作扩展除了rootscope在外的angularscope（http://www.cnblogs.com/lcllao/archive/2012/09/23/2698651.html）的实例。当我们或者angular通过scope.$newAPI（http://docs.angularjs.org/api/ng.$rootScope.Scope#$n...
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular文档讨论的上下文中，术语“model”可以适用于单一对象代表一个实体（例如，一个叫” phones”的model，它的值是一个电话数组。）或者作为应用的全部数据Model（所有实体）。 在angular中，model可以是任意数据，可以通过angular的scope对象的属性来获取model。属性的名称是model的标识，值可以是任意javascript对象（包括数组和原始数据）。 javascript想成为model的唯一的条件是...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/di一、DependencyInjection（依赖注入） 依赖注入（DI）是一个软件设计模式，处理代码如何得到它所依赖的资源。 关于DI更深层次的讨论，可以参观DependencyInjection（http://en.wikipedia.org/wiki/Dependency_injection），InversionofControl（http://martinfowler.com/articles/injection.html），也可以参观软件设计模式的书。 1.DIinanutshel...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/scope一、什么是Scope？ scope（http://code.angularjs.org/1.0.2/docs/api/ng.$rootScope.Scope）是一个指向应用model的object。它也是expression（http://www.cnblogs.com/lcllao/archive/2012/09/16/2687162.html）的执行上下文。scope被放置于一个类似应用的DOM结构的层次结构中。scope可以监测（watch,$watch）expression和传播.
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/module一、什么是Module？ 很多应用都有一个用于初始化、加载（wires是这个意思吗？）和启动应用的main方法。angular应用不需要main方法，作为替代，module提供有指定目的的声明式，描述应用如何启动。这样做有几项优点：这过程是声明描述的，更加容易读懂。在单元测试中，不需要加载所有module，这对写单元测试很有帮助。额外的module可以被加载到情景测试中，可以覆盖一些设置，帮助进行应用的端对端测试（end-to-endtest）。第三方代码可以作为可复用的module打.
阅读全文
摘要：原版地址：http://docs.angularjs.org/guide/ieInternetExplorerCompatibility一、总括 这文章描述InternetExplorer（IE）处理自定义HTML属性、标签的特性（可以理解为“特别糟糕的性质”）。如果我们打算让应用兼容IE8以及以下的版本，那么可以继续往下看。二、ShortVersion（简述） 为了让我们的angular应用在IE上工作，请确保： 1.按需引入JSON.stringify（IE7或以下的都需要这玩意）。我们可以使用JSON2（https://github.com/douglascrockford/JSO...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/i18n一、I18nandL10ninAngularJS1.什么是I18n和L10n? 国际化（Internationalization），简称I18n，是让产品开发在一个他们可以简单地对产品进行语言、文化的本地化的方法的规范。本地化（Localization），简称L10n，一个使得应用、文本有适应特殊的文化或者语言市场的能力的规范。对于应用开发者，使一个程序国际化，意味着需要从程序中抽取所有字符串和其他区域较为特别的地方（例如日期和货币格式）。使一个程序本地化，意味着需要提供根据I18n抽取出.
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/forms 控件（input、select、textarea）是用户输入数据的一种方式。Form（表单）是这些控件的集合，目的是将相关的控件进行分组。 表单和控件提供了验证服务，所以用户可以收到无效输入的提示。这提供了更好的用户体验，因为用户可以立即获取到反馈，知道如何修正错误。请记住，虽然客户端验证在提供良好的用户体验中扮演重要的角色，但是它可以很简单地被绕过，因此，客户端验证是不可信的。服务端验证对于一个安全的应用来说仍然是必要的。一、Simpleform 理解双向数据绑定的关键direc...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/expression 表达式（Expressions）是类Javascript的代码片段，通常放置在绑定区域中（如｛｛expression｝｝）。表达式通过$parse服务（http://code.angularjs.org/1.0.2/docs/api/ng.$parse）解析执行。 例如，以下是angular中有效的表达式：1+23*10|currencyuser.name一、Angular表达式vs.Js表达式 这很容易让人将angular视图表达式联想为javascript表达式，但这...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径。在DOM编译期间，directives匹配HTML并执行。这允许directive注册行为或者转换DOM结构。 Angular自带一组内置的directive，对于建立WebApp有很大帮助。继续扩展的话，可以在HTML定义领域特定语言（domainspecificlanguage,DSL)。一、在HTML中引用directives Directive有驼峰式（camelcased）的风格的命名，如ngBind（放在属性里貌...
阅读全文
摘要：原版地址：http://code.angularjs.org/1.0.2/docs/guide/concepts继续。。一、总括本文主要是angular组件(components)的概览，并说明他们如何工作。列表如下：statup-依旧是helloworld...改为HelloKitty！runtime-介绍angular的runtimescope-view与contorller的纽带（神马glue...胶）controller-app的行为(applicationbehavior)model-app的数据view-用户所看到的东东directives-HTML的语法扩展filters-根据用
阅读全文
摘要：原文再续，书接上回。。。依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler一、总括 Angular的HTMLcompiler允许开发者自定义新的HTML语法。compiler允许我们对任意HTML元素或属性，甚至是新的HTML标签、属性（如<beautifulgirl=”cf”></beautiful>）附加行为。Angular将这些附加行为称为directives。 HTML有很多专门格式化静态文档的预定义HTML样式结构（可以告诉浏览器如何显示标记的内容）。假设某东东需要被居中，而我们不需要教浏览器如何去做
阅读全文