diff --git a/public/docs/ts/latest/cookbook/a1-a2-quick-reference.jade b/public/docs/ts/latest/cookbook/a1-a2-quick-reference.jade index d192916901..53269c0627 100644 --- a/public/docs/ts/latest/cookbook/a1-a2-quick-reference.jade +++ b/public/docs/ts/latest/cookbook/a1-a2-quick-reference.jade @@ -975,7 +975,7 @@ a(id="controllers-components") In both Angular 1 and Angular 2, we use Angular modules to help us organize our application into cohesive blocks of functionality. - 无论在Angular 1还是Angular 2中，我们都要借助“模块”来把应用拆分成一些内聚的功能块儿。 + 无论在Angular 1还是Angular 2中，我们都要借助“模块”来把应用拆分成一些紧密相关的功能块。 In Angular 1, we write the code that provides the model and the methods for the view in a **controller**. In Angular 2, we build a **component**. diff --git a/public/docs/ts/latest/cookbook/component-communication.jade b/public/docs/ts/latest/cookbook/component-communication.jade index 70d87784f9..d0525bb0a9 100644 --- a/public/docs/ts/latest/cookbook/component-communication.jade +++ b/public/docs/ts/latest/cookbook/component-communication.jade @@ -364,11 +364,11 @@ a(id="countdown-tests") Then Angular calls the `ngAfterViewInit` lifecycle hook at which time it is *too late* to update the parent view's display of the countdown seconds. Angular's unidirectional data flow rule prevents us from updating the parent view's in the same cycle. We have to *wait one turn* before we can display the seconds. - 然后Angular会调用`ngAfterViewInit`生命周期钩子，但这时候再更新父组件视图的倒计时就已经太晚了。Angular的单向数据流规则会阻止在同一个周期内更新父组件视图。我们在显示秒数之前会被迫*再等一轮儿*。 + 然后Angular会调用`ngAfterViewInit`生命周期钩子，但这时候再更新父组件视图的倒计时就已经太晚了。Angular的单向数据流规则会阻止在同一个周期内更新父组件视图。我们在显示秒数之前会被迫*再等一轮*。 We use `setTimeout` to wait one tick and then revise the `seconds` method so that it takes future values from the timer component. - 使用`setTimeout`来等下一轮儿，然后改写`seconds`方法，这样它接下来就会从注入的这个计时器组件里获取秒数的值。 + 使用`setTimeout`来等下一轮，然后改写`seconds`方法，这样它接下来就会从注入的这个计时器组件里获取秒数的值。 ### Test it ### 测试 diff --git a/public/docs/ts/latest/cookbook/dependency-injection.jade b/public/docs/ts/latest/cookbook/dependency-injection.jade index 26c6009d00..78ca03692f 100644 --- a/public/docs/ts/latest/cookbook/dependency-injection.jade +++ b/public/docs/ts/latest/cookbook/dependency-injection.jade @@ -635,7 +635,7 @@ figure.image-display If it doesn't, it may be able to make one with the help of a ***provider***. A *provider* is a recipe for delivering a service associated with a *token*. - 注入器从哪儿得到的依赖？ + 注入器从哪得到的依赖？ 它可能在自己内部容器里已经有该依赖了。 如果它没有，也能在***提供商***的帮助下新建一个。 *提供商*就是一个用于交付服务的配方，它被关联到一个令牌。 diff --git a/public/docs/ts/latest/glossary.jade b/public/docs/ts/latest/glossary.jade index 8a0a054f6f..47a8d23de7 100644 --- a/public/docs/ts/latest/glossary.jade +++ b/public/docs/ts/latest/glossary.jade @@ -207,7 +207,7 @@ block includes The practice of writing compound words or phrases such that each word or abbreviation begins with a capital letter _except the first letter which is a lowercase letter_. - 驼峰式命名法是指除了首字母要小写外，每个单词或缩写都以大写字母开头儿的形式来书写复合词或短语的一种实践。 + 驼峰式命名法是指除了首字母要小写外，每个单词或缩写都以大写字母开头的形式来书写复合词或短语的一种实践。 Function, property, and method names are typically spelled in camelCase. Examples include: `square`, `firstName` and `getHeroes`. @@ -233,7 +233,7 @@ block includes The Component is one of the most important building blocks in the Angular system. It is, in fact, an Angular [Directive](#directive) with a companion [Template](#template). - 组件是Angular系统中最重要的基本构造块儿之一。 + 组件是Angular系统中最重要的基本构造块之一。 它其实是一个拥有[模板(Template)](#template)的[指令(Directive)](#directive)。 The developer applies the `#{_at}Component` !{_decoratorLink} to @@ -976,7 +976,7 @@ a#Q is that the package name begins with the Angular *scope name*, `@angular`. 使用和导入*普通*包相同的方式导入范围化包。 - 从消费者的视角看，唯一的不同是那些包的名字是用Angular的*范围名*`@angular`开头儿的。 + 从消费者的视角看，唯一的不同是那些包的名字是用Angular的*范围名*`@angular`开头的。 +makeExcerpt('architecture/ts/app/app.component.ts', 'import', '') @@ -1050,7 +1050,7 @@ a#snake-case the support and continuing guidance of an Angular [Directive](#directive), most notably a [Component](#component). - 模板是一大块儿HTML。Angular会在[指令(Directive)](#directive)特别是[组件(Component)](#component)的支持和持续指导下，用它来渲染[视图(View)](#view)。 + 模板是一大块HTML。Angular会在[指令(Directive)](#directive)特别是[组件(Component)](#component)的支持和持续指导下，用它来渲染[视图(View)](#view)。 We write templates in a special [Template Syntax](/docs/ts/latest/guide/template-syntax.html). @@ -1164,7 +1164,7 @@ a#U A view is a portion of the screen that displays information and responds to user actions such as clicks, mouse moves, and keystrokes. - 视图是屏幕中一小块儿，用来显示信息并回应用户动作，比如点击、移动鼠标和按键等。 + 视图是屏幕中一小块，用来显示信息并回应用户动作，比如点击、移动鼠标和按键等。 Angular renders a view under the control of one or more [Directives](#directive), especially [Component](#component) directives and their companion [Templates](#template). diff --git a/public/docs/ts/latest/guide/architecture.jade b/public/docs/ts/latest/guide/architecture.jade index 15f922cc22..4ba4d87b0f 100644 --- a/public/docs/ts/latest/guide/architecture.jade +++ b/public/docs/ts/latest/guide/architecture.jade @@ -356,7 +356,7 @@ figure A template looks like regular HTML, except for a few differences. Here is a template for our `HeroListComponent`: - 多数情况下，模板看起来很像标准HTML……当然也有一小点儿奇怪的地方。下面是`HeroListComponent`组件的一个模板。 + 多数情况下，模板看起来很像标准HTML……当然也有一点奇怪的地方。下面是`HeroListComponent`组件的一个模板。 +makeExample('app/hero-list.component.html') diff --git a/public/docs/ts/latest/guide/attribute-directives.jade b/public/docs/ts/latest/guide/attribute-directives.jade index 755729b0e6..0e206c0a12 100644 --- a/public/docs/ts/latest/guide/attribute-directives.jade +++ b/public/docs/ts/latest/guide/attribute-directives.jade @@ -164,7 +164,7 @@ block highlight-directive-1 We need a prefix of our own, preferably short, and `my` will do for now. - 我们需要一个自己的前缀，最好短点儿，目前用的这个`my`前缀就不错。 + 我们需要一个自己的前缀，最好短点，目前用的这个`my`前缀就不错。 p | After the #[code @Directive] metadata comes the directive's controller class, which contains the logic for the directive. +ifDocsFor('ts') @@ -193,7 +193,7 @@ a#apply-directive applies the directive as an attribute to a paragraph (`p`) element. In Angular terms, the `

` element will be the attribute **host**. - 这个例子中，`AppComponent`是用来测试`HighlightDirective`的一个壳儿。 + 这个例子中，`AppComponent`是用来测试`HighlightDirective`的一个壳。 我们来给它一个新的模板，把这个指令作为属性应用到一个段落(`p`)元素上。 用Angular的话说，`

`元素就是这个属性型指令的**宿主**。 p @@ -458,7 +458,7 @@ a#input And yet this code works. Where is the template `color` value going? **但我们从来没有在宿主`AppComponent`上定义过color属性**！ - 不过这段代码却能正常工作。模板中的`color`值哪儿去了？ + 不过这段代码却能正常工作。模板中的`color`值哪去了？ Browser debugging reveals that Angular dynamically added a `color` property to the runtime instance of the `AppComponent`. diff --git a/public/docs/ts/latest/guide/component-styles.jade b/public/docs/ts/latest/guide/component-styles.jade index 935d293e69..dd3746f4d0 100644 --- a/public/docs/ts/latest/guide/component-styles.jade +++ b/public/docs/ts/latest/guide/component-styles.jade @@ -262,7 +262,7 @@ block style-url component file. URL是***相对于应用程序根目录的***，它通常是应用的宿主页面`index.html`所在的地方。 - 这个样式文件的URL*不是*相对于组件文件的。这就是为什么范例中的URL用`app/`开头儿。 + 这个样式文件的URL*不是*相对于组件文件的。这就是为什么范例中的URL用`app/`开头。 参见[附录2](#relative-urls)来了解如何指定相对于组件文件的URL。 block module-bundlers @@ -444,7 +444,7 @@ code-example(format=""). We'll likely live with *emulated* mode until shadow DOM gains traction. - 小伙伴儿们会很愉快的使用*仿真*模式 —— 直到有一天Shadow DOM获得全面支持。 + 小伙伴们会很愉快的使用*仿真*模式 —— 直到有一天Shadow DOM获得全面支持。 a#relative-urls .l-main-section diff --git a/public/docs/ts/latest/guide/dependency-injection.jade b/public/docs/ts/latest/guide/dependency-injection.jade index 2110093ae5..87312ef758 100644 --- a/public/docs/ts/latest/guide/dependency-injection.jade +++ b/public/docs/ts/latest/guide/dependency-injection.jade @@ -1077,7 +1077,7 @@ block dart-diff-const-metadata-ctor 注意，我们在#{anexportedvarCn}中捕获了这个工厂提供商：`heroServiceProvider`。 这个额外的步骤让工厂提供商可被复用。 - 只要需要，我们就可以使用这个#{variableCn}注册`HeroService`，无论在哪儿。 + 只要需要，我们就可以使用这个#{variableCn}注册`HeroService`，无论在哪。 In our sample, we need it only in the `HeroesComponent`, where it replaces the previous `HeroService` registration in the metadata `providers` #{_array}. diff --git a/public/docs/ts/latest/guide/displaying-data.jade b/public/docs/ts/latest/guide/displaying-data.jade index e33949a3d0..12c36244a4 100644 --- a/public/docs/ts/latest/guide/displaying-data.jade +++ b/public/docs/ts/latest/guide/displaying-data.jade @@ -231,7 +231,7 @@ figure.image-display That's the Angular "repeater" directive. Its presence on the `

  • ` tag marks that `
  • ` element (and its children) as the "repeater template". - 我们把看起来有点儿神秘的`*ngFor`加到`
  • `元素上。 + 我们把看起来有点神秘的`*ngFor`加到`
  • `元素上。 这就是Angular的“重复器”指令。 它出现在`
  • `标签上就表示把`
  • `及其子元素作为“重复器的模板”。 .alert.is-important diff --git a/public/docs/ts/latest/guide/forms.jade b/public/docs/ts/latest/guide/forms.jade index 95e8afeaf5..35fdcd5fe7 100644 --- a/public/docs/ts/latest/guide/forms.jade +++ b/public/docs/ts/latest/guide/forms.jade @@ -103,7 +103,7 @@ figure.image-display Two of the three fields on this form are required. Required fields have a green bar on the left to make them easy to spot. - 这个表单中的三个字段都是必填的。这些必填的字段在左侧会有一个绿色的条儿，让它们更容易看出来。 + 这个表单中的三个字段都是必填的。这些必填的字段在左侧会有一个绿色的竖条，让它们更容易看出来。 If we delete the hero name, the form displays a validation error in an attention grabbing style: @@ -421,7 +421,7 @@ code-example(format=""). `container`、`form-group`、`form-control`和`btn`类来自[Twitter Bootstrap](http://getbootstrap.com/css/)。纯粹是装饰。 我们使用Bootstrap来打扮我们的表单。 - 嘿，一点儿样式儿都没有的表单算个啥！ + 嘿，一点样式都没有的表单算个啥！ .callout.is-important header Angular Forms Do Not Require A Style Library @@ -807,7 +807,7 @@ figure.image-display strong visual signal when the data are invalid and we want to mark required fields. So we add custom CSS for visual feedback. - (`ng-valid` | `ng-invalid`)这一对儿是我们最感兴趣的。当数据变得无效时，我们希望发出一个强力的视觉信号。我们还希望标记出必填字段。 + (`ng-valid` | `ng-invalid`)这一对是我们最感兴趣的。当数据变得无效时，我们希望发出一个强力的视觉信号。我们还希望标记出必填字段。 于是我们加入自定义CSS来提供视觉反馈。 **Delete** the `#spy` template reference variable and `TODO` as they have served their purpose. @@ -1099,7 +1099,7 @@ figure.image-display Later in the template we bind the button's `disabled` property to the form's over-all validity via the `heroForm` variable. Here's that bit of markup: - 模板中稍后的部分，通过`heroForm`变量，我们把按钮的`disabled`属性绑定到了表单的全员有效性。这里是那点儿HTML： + 模板中稍后的部分，通过`heroForm`变量，我们把按钮的`disabled`属性绑定到了表单的全员有效性。这里是那点HTML： +makeExample('forms/ts/app/hero-form.component.html', 'submit-button') :marked @@ -1186,7 +1186,7 @@ figure.image-display Add the following block of HTML below the `
    ` wrapper we just wrote: 现在，当表单处于已提交状态时，我们需要显示一些别的东西。 - 在我们刚刚写的`
    `包装下方，添加下列HTML块儿： + 在我们刚刚写的`
    `包装下方，添加下列HTML块： +makeExample('forms/ts/app/hero-form.component.html', 'submitted', 'app/hero-form.component.html (节选)') @@ -1195,7 +1195,7 @@ figure.image-display This slug of HTML only appears while the component is in the submitted state. 我们的英雄又来了，它通过插值表达式绑定显示为只读内容。 - 这一小段儿HTML只在组件处于已提交状态时才会显示。 + 这一小段HTML只在组件处于已提交状态时才会显示。 We added an Edit button whose click event is bound to an expression that clears the `submitted` flag. @@ -1204,11 +1204,11 @@ figure.image-display When we click it, this block disappears and the editable form reappears. - 当我们点它时，这个只读块儿消失了，可编辑的表单重新出现了。 + 当我们点它时，这个只读块消失了，可编辑的表单重新出现了。 That's as much drama as we can muster for now. - 现在，它比我们那个刚好够用的版本好玩儿多了。 + 现在，它比我们那个刚好够用的版本好玩多了。 .l-main-section :marked diff --git a/public/docs/ts/latest/guide/hierarchical-dependency-injection.jade b/public/docs/ts/latest/guide/hierarchical-dependency-injection.jade index 26a16a4e27..759daf6009 100644 --- a/public/docs/ts/latest/guide/hierarchical-dependency-injection.jade +++ b/public/docs/ts/latest/guide/hierarchical-dependency-injection.jade @@ -38,7 +38,7 @@ block includes We oversimplified. In fact, there is no such thing as ***the*** injector! An application may have multiple injectors! - 我们其实有点简化过度了。实际上，没有***那个(唯一的)***注入器这回事儿，因为一个应用中可能有很多注入器。 + 我们其实有点简化过度了。实际上，没有***那个(唯一的)***注入器这回事，因为一个应用中可能有很多注入器。 An Angular application is a tree of components. Each component instance has its own injector! The tree of components parallels the tree of injectors. @@ -211,7 +211,7 @@ figure.image-display :marked Now here it’s getting interesting. The `HeroEditorComponent`defines a template with an input to change the name of the hero and a `cancel` and a `save` button. Remember that we said we want to have the flexibility to cancel our editing and restore the old value? This means we need to maintain two copies of our `Hero` that we want to edit. Thinking ahead, this is a perfect use case to abstract it into its own generic service since we have probably more cases like this in our app. - 现在，事情开始变得有趣儿了。`HeroEditorComponent`定义了一个模板，它有一个输入框来修改英雄的名字，以及一个`cancel`按钮和一个`save`按钮。 + 现在，事情开始变得有趣了。`HeroEditorComponent`定义了一个模板，它有一个输入框来修改英雄的名字，以及一个`cancel`按钮和一个`save`按钮。 还记得吗？我们说过要能够灵活的取消编辑，并且回复原值吗？这意味着我们得维护这个待编辑`Hero`的两份实例。 想得超前一点，这是一个把它抽象成一个通用服务的完美案例，因为将来我们的应用中可能会需要更多与此类似的操作逻辑。 @@ -245,7 +245,7 @@ figure.image-display Couldn’t we simply alter our !{_root_NgModule} to include this provider? 它往`HeroEditComponent`的注入器中添加了一个`RestoreService`提供商。 - 不能简化点儿，直接在我们的!{_root_NgModule}后面包含这个提供商吗？ + 不能简化点，直接在我们的!{_root_NgModule}后面包含这个提供商吗？ +makeExcerpt(_appModuleTsVsMainTs, 'bad-alternative') diff --git a/public/docs/ts/latest/guide/ngmodule.jade b/public/docs/ts/latest/guide/ngmodule.jade index 4429f51a78..7cc53cb095 100644 --- a/public/docs/ts/latest/guide/ngmodule.jade +++ b/public/docs/ts/latest/guide/ngmodule.jade @@ -7,7 +7,7 @@ block includes :marked **Angular Modules** help organize an application into cohesive blocks of functionality. - **Angular模块**能帮你把应用组织成多个内聚的功能块儿。 + **Angular模块**能帮你把应用组织成多个内聚的功能块。 An Angular Module is a _class_ adorned with the **@NgModule** decorator function. `@NgModule` takes a metadata object that tells Angular how to compile and run module code. @@ -124,7 +124,7 @@ a#angular-modularity cohesive blocks of functionality, each focused on a feature area, application business domain, workflow, or common collection of utilities. - Angular模块把组件、指令和管道打包成内聚的功能块儿，每一个都聚焦于一个特性分区、业务领域、工作流，或一组通用的工具。 + Angular模块把组件、指令和管道打包成内聚的功能块，每一个都聚焦于一个特性分区、业务领域、工作流，或一组通用的工具。 Modules can also add services to the application. Such services might be internally-developed such as the application logger. diff --git a/public/docs/ts/latest/guide/pipes.jade b/public/docs/ts/latest/guide/pipes.jade index ee998e6a92..93cd5979da 100644 --- a/public/docs/ts/latest/guide/pipes.jade +++ b/public/docs/ts/latest/guide/pipes.jade @@ -593,14 +593,14 @@ h3#async-pipe 非纯管道#[i AsyncPipe] 不管我们怎么做，估计它都会是一个可怕的主意。 但即便如此，为了讲解这个技术点，我们还是写一个吧。 时刻记住，非纯管道可能每隔几微秒就会被调用一次。 - 如果我们不小心点儿，这个管道就会发起一大堆请求“攻击”服务器。 + 如果我们不小心点，这个管道就会发起一大堆请求“攻击”服务器。 We are careful. Our pipe only makes a server call if the request URL has changed. It caches the request URL and waits for a result which it also caches when it arrives. The pipe returns the cached result (which is null while a request is in flight) after every Angular call and only contacts the server as necessary. - 我们确实得小心点儿。所以这个管道只有当所请求的URL发生变化时才会向服务器发起请求。 + 我们确实得小心点。所以这个管道只有当所请求的URL发生变化时才会向服务器发起请求。 它会缓存这个请求的URL，并等待一个结果，当结果发回来时，就缓存它。 以后每当Angular调用此管道时，它都会返回这个缓存的结果(当请求尚未返回时，此结果是空)，只在必要时才会去联系服务器。 diff --git a/public/docs/ts/latest/guide/router.jade b/public/docs/ts/latest/guide/router.jade index 3befbd5882..489d82f671 100644 --- a/public/docs/ts/latest/guide/router.jade +++ b/public/docs/ts/latest/guide/router.jade @@ -796,7 +796,7 @@ a#base-href It's not part of the Angular 2 core. The router is an optional service because not all applications need routing and, depending on your requirements, you may need a different routing library. - 组件路由器在它自己的`@angular/router`包儿中。 + 组件路由器在它自己的`@angular/router`包中。 它不是Angular 2内核的一部分。该路由器是可选的服务，这是因为并不是所有应用都需要路由，并且，如果需要，你还可能需要另外的路由库。 We teach our router how to navigate by configuring it with routes. diff --git a/public/docs/ts/latest/guide/server-communication.jade b/public/docs/ts/latest/guide/server-communication.jade index 326aaf2a94..4c35ab70a1 100644 --- a/public/docs/ts/latest/guide/server-communication.jade +++ b/public/docs/ts/latest/guide/server-communication.jade @@ -690,7 +690,7 @@ code-example(format="." language="javascript"). :marked We may be able to skip the `JSON.stringify` step in the near future. - 用不了多久，我们就能跳过`JSON.stringify`这一步儿了。 + 用不了多久，我们就能跳过`JSON.stringify`这一步了。 :marked ### JSON results diff --git a/public/docs/ts/latest/guide/structural-directives.jade b/public/docs/ts/latest/guide/structural-directives.jade index 78c10114fa..0b55dadc8a 100644 --- a/public/docs/ts/latest/guide/structural-directives.jade +++ b/public/docs/ts/latest/guide/structural-directives.jade @@ -83,7 +83,7 @@ block includes directive: it takes a boolean and makes an entire chunk of DOM appear or disappear. - 我们重点看下`ngIf`。它是一个很好的结构型指令案例：它接受一个布尔值，并据此让一整块儿DOM树出现或消失。 + 我们重点看下`ngIf`。它是一个很好的结构型指令案例：它接受一个布尔值，并据此让一整块DOM树出现或消失。 +makeExample('structural-directives/ts/app/structural-directives.component.html', 'ngIf')(format=".") diff --git a/public/docs/ts/latest/guide/template-syntax.jade b/public/docs/ts/latest/guide/template-syntax.jade index 28837bd545..c20e02c562 100644 --- a/public/docs/ts/latest/guide/template-syntax.jade +++ b/public/docs/ts/latest/guide/template-syntax.jade @@ -1528,7 +1528,7 @@ block style-property-name-dart-diff Let's try something silly like forcing the input value to uppercase: - 来做点淘气的事儿吧，比如强制让输入值变成大写形式： + 来做点淘气的事吧，比如强制让输入值变成大写形式： +makeExample('template-syntax/ts/app/app.component.html', 'NgModel-4')(format=".") :marked Here are all variations in action, including the uppercase version: @@ -1792,8 +1792,8 @@ block dart-no-truthy-falsey Our goal is to present a list of items. We define a block of HTML that defines how a single item should be displayed. We tell Angular to use that block as a template for rendering each item in the list. - 我们的目标是展示一个由多个条目组成的列表。我们定义了一个HTML块儿，它规定了单个条目应该如何显示。 - 我们告诉Angular把这个块儿当做模板，渲染列表中的每个条目。 + 我们的目标是展示一个由多个条目组成的列表。我们定义了一个HTML块，它规定了单个条目应该如何显示。 + 我们告诉Angular把这个块当做模板，渲染列表中的每个条目。 Here is an example of `NgFor` applied to a simple `
    `: @@ -1851,7 +1851,7 @@ block dart-no-truthy-falsey :marked A template input variable is **not** the same as a [template reference variable](#ref-vars)! - 模板输入变量和[模板引用变量](#ref-vars)**不是**一回事儿！ + 模板输入变量和[模板引用变量](#ref-vars)**不是**一回事！ :marked We use this variable within the template to access a hero’s properties, @@ -1958,7 +1958,7 @@ figure.image-display In this section we go under the hood and see how Angular strips away the `*` and expands the HTML into the `