diff --git a/aio/content/guide/ajs-quick-reference.md b/aio/content/guide/ajs-quick-reference.md
index 62b74d5755..1f6d221268 100644
--- a/aio/content/guide/ajs-quick-reference.md
+++ b/aio/content/guide/ajs-quick-reference.md
@@ -542,7 +542,7 @@ AngularJS 为模板提供了七十多个内置指令。
For more information on routing, see [Defining a basic route](guide/router#basic-route)
in the [Routing & Navigation](guide/router) page.
- 要了解关于路由的更多信息，请参见[路由与导航](guide/router)的[RouterLink 绑定](guide/router#router-link)部分。
+ 要了解关于路由的更多信息，请参见[路由与导航](guide/router)的[定义基础路由](guide/router#basic-route)部分。
diff --git a/aio/content/guide/aot-compiler.md b/aio/content/guide/aot-compiler.md
index 0c431a2c96..5ebb192fe4 100644
--- a/aio/content/guide/aot-compiler.md
+++ b/aio/content/guide/aot-compiler.md
@@ -19,7 +19,7 @@ This guide explains how to specify metadata and apply available compiler options
Watch Alex Rickabaugh explain the Angular compiler at AngularConnect 2019.
- 观看编译器作者 Tobias Bosch 在 AngularConnect 2016 大会里，对Angular 编译器的演讲。
+ 观看 Alex Rickabaugh 在 AngularConnect 2019 解释 Angular 编译器的演讲 .
diff --git a/aio/content/guide/architecture-components.md b/aio/content/guide/architecture-components.md
index a04655b63d..bb49a27b0c 100644
--- a/aio/content/guide/architecture-components.md
+++ b/aio/content/guide/architecture-components.md
@@ -5,7 +5,7 @@
A *component* controls a patch of screen called a [*view*](guide/glossary#view "Definition of view").
For example, individual components define and control each of the following views from the [Tour of Heroes tutorial](tutorial):
-*组件*控制屏幕上被称为*视图*的一小片区域。比如，[教程](tutorial/index)中的下列视图都是由一个个组件所定义和控制的：
+*组件*控制屏幕上被称为[*视图*](guide/glossary#view "Definition of view")的一小片区域。比如，[教程](tutorial/index)中的下列视图都是由一个个组件所定义和控制的：
* The app root with the navigation links.
diff --git a/aio/content/guide/dependency-injection-in-action.md b/aio/content/guide/dependency-injection-in-action.md
index 26311fb07d..9459d1b5cb 100644
--- a/aio/content/guide/dependency-injection-in-action.md
+++ b/aio/content/guide/dependency-injection-in-action.md
@@ -845,9 +845,12 @@ The `MinimalLogger` transpiles to this unoptimized, pre-minified JavaScript for
Notice that it doesn't have any members. It never grows no matter how many members you add to the class,
-as long as those members are typed but not implemented. Look again at the TypeScript `MinimalLogger` class to confirm that it has no implementation.
+as long as those members are typed but not implemented.
注意，***只要不实现它***，不管添加多少成员，它都不会增长大小，因为这些成员虽然是有类型的，但却没有实现。
+
+Look again at the TypeScript `MinimalLogger` class to confirm that it has no implementation.
+
你可以再看看 TypeScript 的 `MinimalLogger` 类，确定一下它是没有实现的。
diff --git a/aio/content/guide/deprecations.md b/aio/content/guide/deprecations.md
index 0bc90bfdbc..93f47d44c6 100644
--- a/aio/content/guide/deprecations.md
+++ b/aio/content/guide/deprecations.md
@@ -607,17 +607,17 @@ export class MyModule {
{@a ie-9-10}
### IE 9 and 10 support
-### IE 9 和 10 支持 IE 9
+### IE 9 和 10 支持
Support for IE 9 and 10 has been deprecated and will be removed in a future version.
Supporting outdated browsers like these increases bundle size, code complexity, and test load, and also requires time and effort that could be spent on improvements to the framework.
For example, fixing issues can be more difficult, as a straightforward fix for modern browsers could break old ones that have quirks due to not receiving updates from vendors.
-对 IE 9 和 10 的支持已被弃用，并将在以后的版本中删除。支持像这样过时的浏览器会增加 bundle 的大小，增加代码的复杂性和测试的负载，还需要花费大量的时间和精力来改进框架。例如，修复问题可能会更加困难，因为对于现代浏览器来说，直接修复可能会因为没有收到供应商的更新而破坏那些有怪癖的旧版本。
+对 IE 9 和 10 的支持已被弃用，并将在以后的版本中删除。支持像这样过时的浏览器会增加打包尺寸，增加代码的复杂性和测试的负担，还需要花费大量的时间和精力来改进框架。例如，修复问题可能会更加困难，因为对于现代浏览器那些直接的修复方式可能会破坏那些没有收到更新的怪异旧版本。
The final decision was made on three key points:
-最终决定于三个关键点：
+它的最终决定取决于三点：
- **Vendor support**: Microsoft dropped support of IE 9 and 10 on 1/12/16, meaning they no longer provide security updates or technical support.
@@ -625,7 +625,7 @@ The final decision was made on three key points:
- **Usage statistics**: We looked at usage trends for IE 9 and 10 from various sources and all indicated that usage percentages were extremely small (fractions of 1%).
- **用法统计** ：我们从不同来源查看了 IE 9 和 10 的使用趋势，并且都表明使用率非常小（1％的分数）。
+ **用法统计** ：我们从不同来源查看了 IE 9 和 10 的使用趋势，并且都表明其使用率非常小（不足 1％）。
- **Feedback from partners**: We also reached out to some of our Angular customers and none expressed concern about dropping IE 9 and 10 support.
@@ -640,16 +640,16 @@ The final decision was made on three key points:
The purpose of `WrappedValue` is to allow the same object instance to be treated as different for the purposes of change detection.
It is commonly used with the `async` pipe in the case where the `Observable` produces the same instance of the value.
-`WrappedValue` 的目的是让同一个对象实例被视为不同的对象，以便进行变更检测。在 `Observable` 生成相同值的实例的情况下，它常用于 `async` 管道。
+`WrappedValue` 的目的是让同一个对象实例被视为不同的对象，以便进行变更检测。比如当 `Observable` 生成相同实例的时候，它常用于 `async` 管道。
Given that this use case is relatively rare and special handling impacts application performance, we have deprecated it in v10.
No replacement is planned for this deprecation.
-鉴于此用例相对较少，并且特殊处理会影响应用性能，因此我们已在第 10 版中弃用它。这次弃用并未计划更换。
+鉴于此用例相对较少，并且特殊处理会影响应用性能，因此我们已在第 10 版中弃用它。这项弃用并没有提供替代方案。
If you rely on the behavior that the same object instance should cause change detection, you have two options:
-如果依赖同一个对象实例引起变更检测的行为，你有两个选择：
+如果你要依赖同一个对象实例引起变更检测的行为，那么有两个选择：
- Clone the resulting value so that it has a new identity.
@@ -657,46 +657,46 @@ If you rely on the behavior that the same object instance should cause change de
- Explicitly call [`ChangeDetectorRef.detectChanges()`](api/core/ChangeDetectorRef#detectchanges) to force the update.
- 显式调用[`ChangeDetectorRef.detectChanges()`](api/core/ChangeDetectorRef#detectchanges)来强制进行更新。
+ 显式调用 [`ChangeDetectorRef.detectChanges()`](api/core/ChangeDetectorRef#detectchanges) 进行强制更新。
{@a removed}
## Removed APIs
-## 删除了 API
+## 删除的 API
The following APIs have been removed starting with version 10.0.0\*:
-从 Version 10.0.0 \*开始，已经删除了以下 API：
+从 10.0.0 版开始，已经删除了以下 API：
| Package | API | Replacement | Notes |
| ------- | --- | ----------- | ----- |
-| 包裹 | API | 更换 | 笔记 |
+| 包 | API | 替代品 | 备注 |
| `@angular/core` | Undecorated base classes that use Angular features | Add Angular decorator | See [migration guide](guide/migration-undecorated-classes) for more info |
-| `@angular/core` | 使用 Angular 特性的未修改的基类 | 添加 Angular 装饰器 | 有关详情，请参阅[迁移指南](guide/migration-undecorated-classes) |
+| `@angular/core` | 使用 Angular 特性的不带装饰器的基类 | 添加 Angular 装饰器 | 详情参阅[迁移指南](guide/migration-undecorated-classes) |
| `@angular/core` | `ModuleWithProviders` without a generic | `ModuleWithProviders` with a generic | See [migration guide](guide/migration-module-with-providers) for more info |
-| `@angular/core` | `ModuleWithProviders` 没有泛型 | `ModuleWithProviders` 用泛型的 | 有关详情，请参阅[迁移指南](guide/migration-module-with-providers) |
+| `@angular/core` | 不带泛型的 `ModuleWithProviders` | 带泛型的 `ModuleWithProviders` | 详情参阅[迁移指南](guide/migration-module-with-providers) |
| `@angular/core` | Style Sanitization | no action needed | See [style sanitization API removal](#style-sanitization) for more info |
-| `@angular/core` | 风格消毒 | 不需要任何动作 | 有关更多信息，请参阅[样式清理 API 删除](#style-sanitization) |
+| `@angular/core` | 样式的无害化处理 | 不需要任何动作 | 详情参阅[移除了 样式无害化 API](#style-sanitization) |
\*To see APIs removed in version 9, check out this guide on the [version 9 docs site](https://v9.angular.io/guide/deprecations#removed).
-\*要查看版本 9 中移除的 API，请查看[版本 9 docs 站点](https://v9.angular.io/guide/deprecations#removed)上的本指南。
+\*要查看版本 9 中移除的 API，请查看[版本 9 文档站](https://v9.angular.io/guide/deprecations#removed)上本指南。
{@a esm5-fesm5}
### `esm5` and `fesm5` code formats in @angular/* npm packages
-### @angular/* npm 软件包中的 `esm5` 和 `fesm5` 代码格式
+### `@angular/*` npm 软件包中的 `esm5` 和 `fesm5` 代码格式
As of Angular v8, the CLI primarily consumes the `fesm2015` variant of the code distributed via `@angular/*` npm packages.
This renders the `esm5` and `fesm5` distributions obsolete and unnecessary, adding bloat to the package size and slowing down npm installations.
-从 Angular v8 开始，CLI 就主要使用 通过 `@angular/*` 系列 npm 包分发的 `fesm2015` 变体代码。这就让 `esm5` 和 `fesm5` 的发行版变得过时和不必要，只会增加软件包大小并拖累了 npm 的安装速度。
+从 Angular v8 开始，CLI 就主要使用通过 `@angular/*` 系列 npm 包分发的 `fesm2015` 变体代码。这就让 `esm5` 和 `fesm5` 的发行版变得过时和不必要，只会增加软件包大小并拖累 npm 的安装速度。
This removal has no impact on CLI users, unless they modified their build configuration to explicitly consume these code distributions.
-移除它们不会对 CLI 用户产生任何影响，除非他们修改了自己的构建配置以显式使用这些代码发行版。
+移除它们不会对 CLI 用户产生任何影响，除非他们修改了自己的构建配置以显式使用代码的这些发行版。
Any application still relying on the `esm5` and `fesm5` as the input to its build system will need to ensure that the build pipeline is capable of accepting JavaScript code conforming to ECMAScript 2015 (ES2015) language specification.
@@ -754,17 +754,17 @@ For more information about the npm package format, see the [Angular Package Form
{@a ie-9-10}
### IE 9 and 10 support
-### 对 IE 9 和 10 的支持
+### IE 9 和 10 支持
Support for IE 9 and 10 has been deprecated and will be removed in a future version.
Supporting outdated browsers like these increases bundle size, code complexity, and test load, and also requires time and effort that could be spent on improvements to the framework.
For example, fixing issues can be more difficult, as a straightforward fix for modern browsers could break old ones that have quirks due to not receiving updates from vendors.
-对 IE 9 和 10 的支持已被弃用，并将在以后的版本中删除。支持像这样过时的浏览器会增加 bundle 的大小，增加代码的复杂性和测试的负载，还需要花费大量的时间和精力来改进框架。例如，修复问题可能会更加困难，因为对于现代浏览器来说，直接修复可能会因为没有收到供应商的更新而破坏那些有怪癖的旧版本。
+对 IE 9 和 10 的支持已被弃用，并将在以后的版本中删除。支持像这样过时的浏览器会增加打包尺寸，增加代码的复杂性和测试的负担，还需要花费大量的时间和精力来改进框架。例如，修复问题可能会更加困难，因为对于现代浏览器那些直接的修复方式可能会破坏那些没有收到更新的怪异旧版本。
The final decision was made on three key points:
-最终决定于三个关键点：
+它的最终决定取决于三点：
- **Vendor support**: Microsoft dropped support of IE 9 and 10 on 1/12/16, meaning they no longer provide security updates or technical support.
@@ -772,7 +772,7 @@ The final decision was made on three key points:
- **Usage statistics**: We looked at usage trends for IE 9 and 10 from various sources and all indicated that usage percentages were extremely small (fractions of 1%).
- **用法统计** ：我们从不同来源查看了 IE 9 和 10 的使用趋势，并且都表明使用率非常小（1％的分数）。
+ **用法统计** ：我们从不同来源查看了 IE 9 和 10 的使用趋势，并且都表明其使用率非常小（不足 1％）。
- **Feedback from partners**: We also reached out to some of our Angular customers and none expressed concern about dropping IE 9 and 10 support.
@@ -781,23 +781,25 @@ The final decision was made on three key points:
{@a removed}
## Removed APIs
-## 已删除的 API
+## 删除的 API
-The following APIs have been removed starting with version 10.0.0*:
+The following APIs have been removed starting with version 10.0.0\*:
-从 9.0.0\*版开始，以下 API 已被删除：
+从 10.0.0 版开始，已经删除了以下 API：
-| Package | API | Replacement | Notes |
-| ---------------- | -------------- | ----------- | ----- |
-| 包 | API | 替代品 | 备注 | |
-| `@angular/core` | Undecorated base classes that use Angular features | Add Angular decorator | See [migration guide](guide/migration-undecorated-classes) for more info |
-| `@angular/core` | 用到 Angular 特性的不带装饰器的基类 | 添加 Angular 装饰器 | 欲知详情，参见[迁移指南](guide/migration-undecorated-classes) |
-| `@angular/core` | `ModuleWithProviders` without a generic | `ModuleWithProviders` with a generic | See [migration guide](guide/migration-module-with-providers) for more info |
-| `@angular/core` | 不带泛型的 `ModuleWithProviders` | 带泛型的 `ModuleWithProviders` | 欲知详情，参见 [迁移指南](guide/migration-module-with-providers) |
+| Package | API | Replacement | Notes |
+| ------- | --- | ----------- | ----- |
+| 包 | API | 替代品 | 备注 |
+| `@angular/core` | Undecorated base classes that use Angular features | Add Angular decorator | See [migration guide](guide/migration-undecorated-classes) for more info |
+| `@angular/core` | 使用 Angular 特性的不带装饰器的基类 | 添加 Angular 装饰器 | 详情参阅[迁移指南](guide/migration-undecorated-classes) |
+| `@angular/core` | `ModuleWithProviders` without a generic | `ModuleWithProviders` with a generic | See [migration guide](guide/migration-module-with-providers) for more info |
+| `@angular/core` | 不带泛型的 `ModuleWithProviders` | 带泛型的 `ModuleWithProviders` | 详情参阅[迁移指南](guide/migration-module-with-providers) |
+| `@angular/core` | Style Sanitization | no action needed | See [style sanitization API removal](#style-sanitization) for more info |
+| `@angular/core` | 样式的无害化处理 | 不需要任何动作 | 详情参阅[移除了 样式无害化 API](#style-sanitization) |
-*To see APIs removed in version 9, check out this guide on the [version 9 docs site](https://v9.angular.io/guide/deprecations#removed).
+\*To see APIs removed in version 9, check out this guide on the [version 9 docs site](https://v9.angular.io/guide/deprecations#removed).
-要查看版本 8 中删除的 API，请查看[版本 8 文档站点](https://v8.angular.io/guide/deprecations#removed)上的本指南。
+\*要查看版本 9 中移除的 API，请查看[版本 9 文档站](https://v9.angular.io/guide/deprecations#removed)上本指南。
{@a http}
@@ -880,9 +882,9 @@ For more information about using `@angular/common/http`, see the [HttpClient gui
### Style Sanitization for `[style]` and `[style.prop]` bindings
-### `[style]` 和 `[style.prop]` 绑定的 Style `[style.prop]`
+### `[style]` 和 `[style.prop]` 绑定的样式无害化
Angular used to sanitize `[style]` and `[style.prop]` bindings to prevent malicious code from being inserted through `javascript:` expressions in CSS `url()` entries. However, most modern browsers no longer support the usage of these expressions, so sanitization was only maintained for the sake of IE 6 and 7. Given that Angular does not support either IE 6 or 7 and sanitization has a performance cost, we will no longer sanitize style bindings as of version 10 of Angular.
-Angular 用来清理 `[style]` 和 `[style.prop]` 绑定，以防止恶意代码通过 CSS `url()` 条目中的 `javascript:` expressions 进行插入。但是，大多数现代浏览器都不再支持这些表达式的使用，所以只有 IE 6 和 7 才能维护清理。鉴于 Angular 不支持 IE 6 或 7，并且清理有性能代价，我们将不再清理 Angular 版本 10 中的样式绑定。
+Angular 会清理 `[style]` 和 `[style.prop]` 绑定，以防止恶意代码通过 CSS `url()` 条目中的 `javascript:` 表达式进行插入。但是，大多数现代浏览器都已不再支持这些表达式的使用，所以这种清理只对 IE 6 和 7 才有意义。鉴于 Angular 不支持 IE 6 或 7，并且这种清理有性能代价，因此我们将不再清理 Angular 版本 10 中的样式绑定。
diff --git a/aio/content/guide/displaying-data.md b/aio/content/guide/displaying-data.md
index a2d9cf5be5..5771d2194d 100644
--- a/aio/content/guide/displaying-data.md
+++ b/aio/content/guide/displaying-data.md
@@ -241,7 +241,7 @@ Don't forget the leading asterisk (\*) in `*ngFor`. It is an essential part of t
Read more about `ngFor` and `*` in the [ngFor section](guide/template-syntax#ngfor) of the [Template Syntax](guide/template-syntax) page.
不要忘记 `*ngFor` 中的前导星号 (\*)。它是语法中不可或缺的一部分。
-更多信息，见[模板语法](guide/template-syntax#ngFor)。
+关于 `ngFor` 和 `*` 的更多信息，参见[模板语法](guide/template-syntax#ngFor)页的 [ngFor 部分](guide/template-syntax#ngfor)。
@@ -305,7 +305,7 @@ of hero names into an array of `Hero` objects. For that you'll need a `Hero` cla
This command creates the following code.
-代码如下：
+此命令创建了如下代码：
@@ -429,6 +429,7 @@ The browser should refresh automatically and the message should disappear.
试一下。因为这个数组中有四个条目，所以消息应该显示出来。
回到 `app.component.ts`，从英雄数组中删除或注释掉一个元素。
浏览器应该自动刷新，消息应该会消失。
+
## Summary
## 小结
diff --git a/aio/content/guide/glossary.md b/aio/content/guide/glossary.md
index a8d3b79431..7d71099d65 100644
--- a/aio/content/guide/glossary.md
+++ b/aio/content/guide/glossary.md
@@ -345,7 +345,7 @@ See also [Schematics CLI](#schematics-cli).
A class with the `@Component()` [decorator](#decorator) that associates it with a companion [template](#template). Together, the component class and template define a [view](#view).
-一个带有 `@Component()` [装饰器](#decorator)的类，和它的伴生[模板](#template)关联在一起。组件及其模板共同定义了一个[视图](#view)。
+一个带有 `@Component()` [装饰器](#decorator)的类，和它的伴生[模板](#template)关联在一起。组件类及其模板共同定义了一个[视图](#view)。
A component is a special type of [directive](#directive).
The `@Component()` decorator extends the `@Directive()` decorator with template-oriented features.
@@ -358,7 +358,7 @@ Angular 的组件类负责暴露数据，并通过[数据绑定机制](#data-bin
Read more about component classes, templates, and views in [Introduction to Angular concepts](guide/architecture).
-要了解更多关于组件、模板和视图的知识，参见 [架构概览](guide/architecture) 一章。
+要了解更多关于组件类、模板和视图的知识，参见 [架构概览](guide/architecture) 一章。
## configuration
@@ -682,14 +682,14 @@ Compare to [custom element](#custom-element).
## 入口点（Entry Point）
-A JavaScript module(#module) that is intended to be imported by a user of [an
+A [JavaScript module](#module) that is intended to be imported by a user of [an
npm package](guide/npm-packages). An entry-point module typically re-exports
symbols from other internal modules. A package can contain multiple
entry points. For example, the `@angular/core` package has two entry-point
modules, which can be imported using the module names `@angular/core` and
`@angular/core/testing`.
-JavaScript 模块(#module)的目的是供 [npm 包](guide/npm-packages)的用户进行导入。入口点模块通常会重新导出来自其它内部模块的一些符号。每个包可以包含多个入口点。比如 `@angular/core` 就有两个入口点模块，它们可以使用名字 `@angular/core` 和 `@angular/core/testing` 进行导入。
+[JavaScript 模块](#module)的目的是供 [npm 包](guide/npm-packages)的用户进行导入。入口点模块通常会重新导出来自其它内部模块的一些符号。每个包可以包含多个入口点。比如 `@angular/core` 就有两个入口点模块，它们可以使用名字 `@angular/core` 和 `@angular/core/testing` 进行导入。
{@a F}
@@ -826,10 +826,9 @@ or displayed between element tags, as in this example.
[属性数据绑定 (property data binding)](#data-binding) 的一种形式，位于双大括号中的[模板表达式 (template expression)](#template-expression)会被渲染成文本。
在被赋值给元素属性或者显示在元素标签中之前，这些文本可能会先与周边的文本合并，参见下面的例子。
-
-
-
-
+```html
+
+```
Read more about [interpolation](guide/template-syntax#interpolation) in [Template Syntax](guide/template-syntax).
@@ -1501,7 +1500,7 @@ You can also define a custom builder, and add a target to the project configurat
Code that defines how to render a component's [view](#view).
-模板是与组件相关的代码，用来定义如何在 HTML 中渲染组件的[视图](#view)。
+用来定义要如何在 HTML 中渲染组件[视图](#view)的代码。
A template combines straight HTML with Angular [data-binding](#data-binding) syntax, [directives](#directive),
and [template expressions](#template-expression) (logical constructs).
@@ -1511,7 +1510,7 @@ The Angular elements insert or calculate values that modify the HTML elements be
A template is associated with a [component class](#component) through the `@Component()` [decorator](#decorator). The template code can be provided inline, as the value of the `template` property, or in a separate HTML file linked through the `templateUrl` property.
-模板通过 `@Component()` [装饰器](#decorator)与[组件](#component)类关联起来。其 HTML 可以作为 `template` 属性的值用内联的方式提供，也可以通过 `templateUrl` 属性链接到一个独立的 HTML 文件。
+模板通过 `@Component()` [装饰器](#decorator)与[组件类](#component)类关联起来。模板代码可以作为 `template` 属性的值用内联的方式提供，也可以通过 `templateUrl` 属性链接到一个独立的 HTML 文件。
Additional templates, represented by `TemplateRef` objects, can define alternative or *embedded* views, which can be referenced from multiple components.
@@ -1654,7 +1653,7 @@ Views are typically collected into [view hierarchies](#view-tree).
[组件 (component)](#component) 类及其关联的[模板 (template)](#template)定义了一个视图。
具体实现上，视图由一个与该组件相关的 `ViewRef` 实例表示。
-属于某个组件的视图叫做*宿主视图*。
+直属于某个组件的视图叫做*宿主视图*。
通常会把视图组织成一些[视图树（view hierarchies）](#view-tree)。
Properties of elements in a view can change dynamically, in response to user actions;
diff --git a/aio/content/guide/ivy-compatibility-examples.md b/aio/content/guide/ivy-compatibility-examples.md
index 1ebf8d5712..adcc793a11 100644
--- a/aio/content/guide/ivy-compatibility-examples.md
+++ b/aio/content/guide/ivy-compatibility-examples.md
@@ -1,18 +1,29 @@
# Ivy compatibility examples
+# Ivy 的兼容性例子
+
This appendix is intended to provide more background on Ivy changes. Many of these examples list error messages you may see, so searching by error message might be a good idea if you are debugging.
+本附录旨在为 Ivy 的变更提供更多背景信息。其中很多例子列出了你可能会看到的错误信息，所以如果你正在调试，按错误信息搜索可能是个好主意。
+
NOTE: Most of these issues affect a small percentage of applications encountering unusual or rare edge cases.
{@a content-children-descendants}
+
## @ContentChildren queries only match direct children by default
+## @ContentChildren 查询默认只匹配直接子组件
+
### Basic example of change
+### 变更的基本例子
+
Let's say a component (`Comp`) has a `@ContentChildren` query for `'foo'`:
+假设某个组件（ `Comp` ）对 `'foo'` 有 `@ContentChildren` 查询：
+
```html
@@ -24,17 +35,27 @@ Let's say a component (`Comp`) has a `@ContentChildren` query for `'foo'`:
In the previous runtime, the `
` with `#foo` would match.
With Ivy, that `
` does not match because it is not a direct child of ``.
+在之前的运行时中，带 `#foo` 的 `
` 会匹配到。而在 Ivy 中， `
` 不能匹配，因为它不是 `` 的直接子节点。
+
### Background
+### 背景
+
By default, `@ContentChildren` queries have the `descendants` flag set to `false`.
+默认情况下， `@ContentChildren` 查询的 `descendants` 标志设置为 `false` 。
+
In the previous rendering engine, "descendants" referred to "descendant directives".
An element could be a match as long as there were no other directives between the element and the requesting directive.
This made sense for directives with nesting like tabs, where nested tab directives might not be desirable to match.
However, this caused surprising behavior for users because adding an unrelated directive like `ngClass` to a wrapper element could invalidate query results.
+在前面的渲染引擎中，“descendants” 指的是“后代指令”。只要元素和请求指令之间没有其它指令，元素就可以匹配。这对于类似于 tabs （页标签组）的嵌套的指令是有意义的，其中嵌套的 tab 指令可能不适合匹配。但是，这会给用户带来令人惊讶的行为，因为只要在包装器元素中添加一个不相关的指令（如 `ngClass`） 就可能会让查询结果无效。
+
For example, with the content query and template below, the last two `Tab` directives would not be matches:
+例如，如果使用下面的内容查询和模板，最后两个 `Tab` 指令不匹配：
+
```
@ContentChildren(Tab, {descendants: false}) tabs: QueryList
```
@@ -56,6 +77,8 @@ For example, with the content query and template below, the last two `Tab` direc
In addition, the differences between type and string predicates were subtle and sometimes unclear.
For example, if you replace the type predicate above with a `'foo'` string predicate, the matches change:
+另外，使用类型谓词和使用字符串谓词之间的差异很微妙，有时甚至都分不清。例如，如果用 `'foo'` 字符串谓词替换上面的类型谓词，匹配就会改变：
+
```
@ContentChildren('foo', {descendants: false}) foos: QueryList
```
@@ -79,7 +102,12 @@ Instead, we simplified the mental model so that "descendants" refers to DOM nest
Any DOM element between the requesting component and a potential match will invalidate that match.
Type predicates and string predicates also have identical matching behavior.
+由于之前的行为对用户来说是不一致和令人惊讶的，所以我们不打算在 Ivy 中重现它。相反，我们简化了其心智模型，以便 “descendants” 只标识 DOM 嵌套。位于发出请求的组件和潜在匹配项之间的任何 DOM 元素都会使该匹配失效。类型谓词和字符串谓词也有了相同的匹配行为。
+
Ivy behavior for directive/string predicates:
+
+指令/字符串谓词的 Ivy 行为：
+
```
@@ -96,27 +124,45 @@ Ivy behavior for directive/string predicates:
### Example of error
+### 错误信息的例子
+
The error message that you see will depend on how the particular content query is used in the application code.
Frequently, an error is thrown when a property is referenced on the content query result (which is now `undefined`).
+你看到的错误信息取决于应用代码中特定的内容查询的使用方式。当在内容查询结果中引用一个属性（这里是 `undefined`）时，就会抛出一个错误。
+
For example, if the component sets the content query results to a property, `foos`, `foos.first.bar` would throw the error:
+例如，如果组件把内容查询结果设置为属性，那么 `foos`、`foos.first.bar` 会抛出错误：
+
```
Uncaught TypeError: Cannot read property 'bar' of undefined
```
If you see an error like this, and the `undefined` property refers to the result of a `@ContentChildren` query, it may well be caused by this change.
+如果你看到这样的错误，并且 `undefined` 属性引用了 `@ContentChildren` 查询的结果，那么很可能就是由于这个变化造成的。
+
### Recommended fix
+### 推荐的修复方式
+
You can either add the `descendants: true` flag to ignore wrapper elements or remove the wrapper elements themselves.
+你可以添加 `descendants: true` 标志来忽略包装元素，也可以自己删除包装元素。
+
Option 1:
+
+方案 1：
+
```
@ContentChildren('foo', {descendants: true}) foos: QueryList;
```
Option 2:
+
+方案 2：
+
```
@@ -124,12 +170,19 @@ Option 2:
```
{@a undecorated-classes}
+
## All classes that use Angular DI must have an Angular class-level decorator
+## 所有使用 Angular DI 的类都必须有一个 Angular 类级装饰器
+
### Basic example of change:
+### 变更的基本例子：
+
In the previous rendering engine, the following would work:
+在以前的渲染引擎中，下列代码可以正常工作：
+
```
export class DataService {
constructor(@Inject('CONFIG') public config: DataConfig) {}
@@ -141,8 +194,12 @@ export class AppService extends DataService {...}
In Ivy, it will throw an error because `DataService` is using Angular dependency injection, but is missing an `@Injectable` decorator.
+在 Ivy 中，它会抛出一个错误，因为 `DataService` 正在使用 Angular 依赖注入，但它却缺少一个 `@Injectable` 装饰器。
+
The following would also work in the previous rendering engine, but in Ivy would require a `@Directive` decorator because it uses DI:
+下列渲染引擎也能正常工作，但是 Ivy 需要一个 `@Directive` 装饰器，因为它使用了 DI：
+
```
export class BaseMenu {
constructor(private vcr: ViewContainerRef) {}
@@ -154,25 +211,41 @@ export class SettingsMenu extends BaseMenu {}
The same is true if your directive class extends a decorated directive, but does not have a decorator of its own.
+如果指令类扩展了装饰指令，但却没有自己的装饰器，那也是如此。
+
If you're using the CLI, there are two automated migrations that should transition your code for you ([this one](guide/migration-injectable) and [this one](guide/migration-undecorated-classes)).
However, as you're adding new code in version 9, you may run into this difference.
+如果你正在使用 CLI，那么有两个自动迁移应该为你转移你的代码（ [本章](guide/migration-injectable)和[本章](guide/migration-undecorated-classes) ）。但是，当你在版本 9 中添加新代码时，可能会遇到这种不同。
+
### Background
+### 背景
+
When a class has an Angular decorator like `@Injectable` or `@Directive`, the Angular compiler generates extra code to support injecting dependencies into the constructor of your class.
When using inheritance, Ivy needs both the parent class and the child class to apply a decorator to generate the correct code.
Otherwise, when the decorator is missing from the parent class, the subclass will inherit a constructor from a class for which the compiler did not generate special constructor info, and Angular won't have the dependency info it needs to create it properly.
+当一个类有一个像 `@Injectable` 或 `@Directive` 这样的 Angular 装饰器时，Angular 编译器会生成额外的代码，以支持把依赖注入到类的构造函数中。当使用继承时，Ivy 既需要父类，也要让子类应用装饰器来生成正确的代码。否则，当父类中缺少装饰器时，该子类将继承一个构造函数，而这个构造函数并没有为编译器生成特殊的构造函数信息，而 Angular 也没有正确创建它所需的依赖信息。
+
In the previous rendering engine, the compiler had global knowledge, so in some cases (such as AOT mode or the presence of certain injection flags), it could look up the missing data.
However, the Ivy compiler only processes each class in isolation.
This means that compilation has the potential to be faster (and opens the framework up for optimizations and features going forward), but the compiler can't automatically infer the same information as before.
+在之前的渲染引擎中，编译器具有全局知识，所以在某些情况下（比如 AOT 模式或某些注入标志的存在），它可以查找丢失的数据。然而，Ivy 编译器只是孤立地处理每个类。这意味着编译有可能更快（并为今后的优化和特性打开框架），但编译器不能自动推断出和以前一样的信息。
+
Adding the proper decorator explicitly provides this information.
+添加合适的装饰器会明确提供这些信息。
+
### Example of error
+### 错误信息的例子
+
In JIT mode, the framework will throw the following error:
+在 JIT 模式下，该框架会抛出以下错误：
+
```
ERROR: This constructor is not compatible with Angular Dependency Injection because its dependency at index X of the parameter list is invalid.
This can happen if the dependency type is a primitive like a string or if an ancestor of this class is missing an Angular decorator.
@@ -182,6 +255,8 @@ Please check that 1) the type for the parameter at index X is correct and 2) the
In AOT mode, you'll see something like:
+在 AOT 模式下，你会看到如下内容：
+
```
X inherits its constructor from Y, but the latter does not have an Angular decorator of its own.
Dependency injection will not be able to resolve the parameters of Y's constructor. Either add a
@@ -192,16 +267,24 @@ In some cases, the framework may not be able to detect the missing decorator.
In these cases, you'll generally see a runtime error thrown when there is a property access attempted on the missing dependency.
If dependency was `foo`, you'd see an error when accessing something like `foo.bar`:
+在某些情况下，框架可能无法检测到丢失的装饰器。在这种情况下，你会发现试图对所缺的依赖项进行属性访问时，就会抛出一个运行时错误。如果依赖是 `foo` ，你在访问 `foo.bar` 这样的东西时会看到一个错误：
+
```
Uncaught TypeError: Cannot read property 'bar' of undefined
```
If you see an error like this, and the `undefined` value refers to something that should have been injected, it may be this change.
+如果你看到这样的错误，并且 `undefined` 值引用了应该注入的内容，那么可能就是这种变化。
+
### Recommended fix
+### 推荐的修复方式
+
- Add an `@Injectable` decorator to anything you plan to provide or inject.
+ 把 `@Injectable` 装饰器添加到你打算提供或注入的东西中。
+
```
@Injectable()
export class DataService {
@@ -214,6 +297,8 @@ export class AppService extends DataService {...}
- Add a [selectorless `@Directive` decorator](guide/migration-undecorated-classes#what-does-it-mean-to-have-a-directive-decorator-with-no-metadata-inside-of-it) to any class that extends a directive or any class from which a directive inherits.
+ 把 [无选择器的 `@Directive` 装饰器](guide/migration-undecorated-classes#what-does-it-mean-to-have-a-directive-decorator-with-no-metadata-inside-of-it)添加到扩展指令的类或被指令继承的任何类中。
+
```
@Directive() // selectorless, so it's not usable directly
export class BaseMenu {
@@ -225,10 +310,15 @@ export class SettingsMenu extends BaseMenu {}
```
{@a select-value-binding}
+
## Cannot Bind to `value` property of `
```
*After*
+
+*之后*
+
```html
{{ myName }}
diff --git a/aio/content/guide/providers.md b/aio/content/guide/providers.md
index 396615ecb1..ba9ba76f49 100644
--- a/aio/content/guide/providers.md
+++ b/aio/content/guide/providers.md
@@ -1,6 +1,6 @@
# Providing dependencies in modules
-# 服务提供者
+# 在模块中提供依赖
A provider is an instruction to the [Dependency Injection](/guide/dependency-injection) system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide.
diff --git a/aio/content/guide/reactive-forms.md b/aio/content/guide/reactive-forms.md
index 9de0093e6e..1055b6f339 100644
--- a/aio/content/guide/reactive-forms.md
+++ b/aio/content/guide/reactive-forms.md
@@ -190,7 +190,7 @@ Reactive forms provide access to information about a given control through prope
These properties and methods of the underlying [AbstractControl](api/forms/AbstractControl "API reference.") class are used to control form state and determine when to display messages when handling [input validation](#basic-form-validation "Learn more about validating form input.").
响应式表单还能通过每个实例的属性和方法提供关于特定控件的更多信息。[AbstractControl](api/forms/AbstractControl) 的这些属性和方法用于控制表单状态，并在处理表单校验时决定何时显示信息。
-欲知详情，参见稍后的[简单表单验证](#basic-form-validation)一节。
+欲知详情，参见稍后的[输入验证](#basic-form-validation)一节。
Read about other `FormControl` properties and methods in the [API Reference](api/forms/FormControl "Detailed syntax reference.").
diff --git a/aio/content/guide/releases.md b/aio/content/guide/releases.md
index 923aa305f1..43be4d1152 100644
--- a/aio/content/guide/releases.md
+++ b/aio/content/guide/releases.md
@@ -133,11 +133,11 @@ In general, you can expect the following release cycle:
* A patch release and pre-release (`next` or `rc`) build almost every week
- 差不多每周一个补丁版本
+ 差不多每周一个发行版或预发行版(`next` 或 `rc`)的补丁版本
This cadence of releases gives eager developers access to new features as soon as they are fully developed and pass through our code review and integration testing processes, while maintaining the stability and reliability of the platform for production users that prefer to receive features after they have been validated by Google and other developers that use the pre-release builds.
-这种发布节奏能让你尽快用上已就绪的新特性，同时，为生产环境下的用户维护本平台的稳定性和可靠性。
+这种发布的节奏能让渴望新功能的开发者在这些功能开发开发完成并通过我们的代码审查和集成测试流程后立即就可以使用，同时为那些喜欢在新功能经过 Google 和其他使用预发布版本的开发人员的验证后才采纳的生产环境用户，保持平台的稳定性和可靠性。
{@a lts}
{@a support}
diff --git a/aio/content/guide/setup-local.md b/aio/content/guide/setup-local.md
index fa5308d580..8ea372a0f1 100644
--- a/aio/content/guide/setup-local.md
+++ b/aio/content/guide/setup-local.md
@@ -15,7 +15,7 @@ It includes information about prerequisites, installing the CLI, creating an ini
If you are new to Angular, you might want to start with [Try it now!](start), which introduces the essentials of Angular in the context of a ready-made basic online store app that you can examine and modify. This standalone tutorial takes advantage of the interactive [StackBlitz](https://stackblitz.com/) environment for online development. You don't need to set up your local environment until you're ready.
-如果你不熟悉 Angular，请参阅[快速上手](start)。在构建基本版在线商店应用的过程中，快速上手可以帮助你快速学习 Angular 的基本知识。它充分利用了 [StackBlitz](https://stackblitz.com/) 在线开发环境，因此在你准备就绪之前，都不需要建立本地环境。
+如果你不熟悉Angular，可能要从[立即尝试！](start)开始，它可以在查看和修改一个现成的基础版在线商店的上下文中介绍 Angular 的要点。这个独立的教程利用交互式的 [StackBlitz](https://stackblitz.com/) 环境进行在线开发。在你准备好这些之前，无需设置本地环境。
@@ -183,7 +183,7 @@ You will see:
* Work through the [Tour of Heroes Tutorial](tutorial), a complete hands-on exercise that introduces you to the app development process using the Angular CLI and walks through important subsystems.
- 走一遍[英雄指南教程](tutorial)，这是一个完整的动手练习题，它将教你使用 Angular CLI 进行应用开发的过程，并逐步介绍重要的子系统。
+ 过一遍[英雄指南教程](tutorial)，这是一个完整的动手练习题，它将教你使用 Angular CLI 进行应用开发的过程，并逐步介绍重要的子系统。
* To learn more about using the Angular CLI, see the [CLI Overview](cli "CLI Overview"). In addition to creating the initial workspace and app scaffolding, you can use the CLI to generate Angular code such as components and services. The CLI supports the full development cycle, including building, testing, bundling, and deployment.
diff --git a/aio/content/guide/structural-directives.md b/aio/content/guide/structural-directives.md
index f12700ca43..c8ff27ce6f 100644
--- a/aio/content/guide/structural-directives.md
+++ b/aio/content/guide/structural-directives.md
@@ -382,7 +382,7 @@ The following sections provide detailed information on constraints, grammar,
and translation of microsyntax.
当你编写自己的结构型指令时，也可以利用这些微语法机制。
-例如，Angular 中的微语法允许你写成 `
{{item}}
` 而不是 `
{{item}}
`。
+例如，Angular 中的微语法允许你写成 `
{{item}}
` 而不是 `
{{item}}
`。
以下各节提供了有关约束、语法和微语法翻译方式的详细信息。
### Constraints
diff --git a/aio/content/guide/styleguide.md b/aio/content/guide/styleguide.md
index 05b167d6e3..9eb383f50a 100644
--- a/aio/content/guide/styleguide.md
+++ b/aio/content/guide/styleguide.md
@@ -73,6 +73,7 @@ For example, `hero.component.ts` and `hero.component.html`.
The guideline uses the shortcut `hero.component.ts|html|css|spec` to represent those various files. Using this shortcut makes this guide's file structures easier to read and more terse.
本指南将会使用像 `hero.component.ts|html|css|spec` 的简写来表示上面描述的多个文件，目的是保持本指南的简洁性，增加描述文件结构时的可读性。
+
{@a single-responsibility}
## Single responsibility
diff --git a/aio/content/guide/template-syntax.md b/aio/content/guide/template-syntax.md
index 4118ee813f..9d0a1c6493 100644
--- a/aio/content/guide/template-syntax.md
+++ b/aio/content/guide/template-syntax.md
@@ -402,11 +402,11 @@ The template statement parser differs from the template expression parser and
specifically supports both basic assignment (`=`) and chaining expressions with ;.
和模板表达式一样，模板*语句*使用的语言也像 JavaScript。
- 模板语句解析器和模板表达式解析器有所不同，特别之处在于它支持基本赋值 (`=`) 和表达式链 (`;` 和 `,`)。
+ 模板语句解析器和模板表达式解析器有所不同，特别之处在于它支持基本赋值 (`=`) 和表达式链 (`;`)。
However, certain JavaScript and template expression syntax is not allowed:
-然而，某些 JavaScript 语法仍然是不允许的：
+然而，某些 JavaScript 语法和模板表达式语法仍然是不允许的：
* new
@@ -422,11 +422,11 @@ However, certain JavaScript and template expression syntax is not allowed:
* the bitwise operators, such as `|` and `&`
- 位运算符 `|` 和 `&`
+ 位运算符，例如 `|` 和 `&`
* the [pipe operator](guide/template-syntax#pipe)
- [模板表达式运算符](guide/template-syntax#expression-operators)
+ [管道运算符](guide/template-syntax#expression-operators)
### Statement context
@@ -1260,13 +1260,13 @@ the syntax and thinking are the same.
In this scenario, `ItemListComponent` is nested within `AppComponent` and the `items` property expects an array of objects.
-在这种情况下，`ListItemComponent` 嵌套在 `AppComponent` 中，并且 `item` 属性需要一个对象。
+在这种情况下，`ItemListComponent` 嵌套在 `AppComponent` 中，并且 `items` 属性需要一个对象数组。
The `items` property is declared in the `ItemListComponent` with a type of `Item` and decorated with `@Input()`:
-`item` 属性是在 `ListItemComponent` 中用 `Item` 类型声明的，并带有 `@Input()` 装饰器：
+`items` 属性是在 `ItemListComponent` 中用 `Item` 类型声明的，并带有 `@Input()` 装饰器：
@@ -1285,13 +1285,13 @@ specify a different item in `app.component.ts` so that the new item will render:
You just have to make sure, in this case, that you're supplying an array of objects because that's the type of `Item` and is what the nested component, `ItemListComponent`, expects.
-在这个例子中，你只需要确保你所提供的对象的类型，也就是这个 `item` 的类型是嵌套组件 `ListItemComponent` 所需要的类型。
+在这个例子中，你只需要确保你所提供的对象数组的类型，也就是这个 `Item` 的类型是嵌套组件 `ItemListComponent` 所需要的类型。
In this example, `AppComponent` specifies a different `item` object
(`currentItems`) and passes it to the nested `ItemListComponent`. `ItemListComponent` was able to use `currentItems` because it matches what an `Item` object is according to `item.ts`. The `item.ts` file is where
`ItemListComponent` gets its definition of an `item`.
-在此示例中，`AppComponent` 指定了另一个 `item` 对象（ `currentItem` ）并将其传给嵌套的 `ListItemComponent`。`ListItemComponent` 之所以能够使用 `currentItem` 是因为它与 `item.ts` 中定义的 `Item` 对象的类型相匹配。在 `item.ts` 文件中，`ListItemComponent` 获得了其对 `item` 的定义。
+在此示例中，`AppComponent` 指定了另一个 `item` 对象（ `currentItems` ）并将其传给嵌套的 `ItemListComponent`。`ItemListComponent` 之所以能够使用 `currentItems` 是因为它与 `item.ts` 中定义的 `Item` 对象的类型相匹配。在 `item.ts` 文件中，`ItemListComponent` 获得了其对 `item` 的定义。
### Remember the brackets
@@ -1342,7 +1342,7 @@ not a template expression. Angular sets it and forgets about it.
The `[item]` binding, on the other hand, remains a live binding to the component's `currentItems` property.
-另一方面，`[item]` 绑定仍然是与组件的 `currentItem` 属性的实时绑定。
+另一方面，`[item]` 绑定仍然是与组件的 `currentItems` 属性的实时绑定。
### Property binding vs. interpolation
@@ -3623,7 +3623,7 @@ Angular 的非空断言运算符 `!` 在 Angular 模板中具有相同的目的
When the Angular compiler turns your template into TypeScript code,
it prevents TypeScript from reporting that `item.color` might be `null` or `undefined`.
-当 Angular 编译器把你的模板转换成 TypeScript 代码时，它会防止 TypeScript 不要报告此 `item` 可能为 `null` 或 `undefined` 的错误。
+当 Angular 编译器把你的模板转换成 TypeScript 代码时，它会防止 TypeScript 不要报告此 `item.color` 可能为 `null` 或 `undefined` 的错误。
Unlike the [_safe navigation operator_](guide/template-syntax#safe-navigation-operator "Safe navigation operator (?)"),
the non-null assertion operator does not guard against `null` or `undefined`.
diff --git a/aio/content/guide/template-typecheck.md b/aio/content/guide/template-typecheck.md
index eb702e2024..8d427ef60e 100644
--- a/aio/content/guide/template-typecheck.md
+++ b/aio/content/guide/template-typecheck.md
@@ -368,7 +368,7 @@ First, enabling `strictNullChecks` and including `null` in an input's type, as a
Additionally, it is possible to provide type hints that are specific to the template type checker. See [Improving template type checking for custom directives](guide/structural-directives#directive-type-checks), and [Input setter coercion](#input-setter-coercion) below.
作为库作者，你可以采取多种措施为用户提供最佳体验。首先，启用 `strictNullChecks` 并在输入的类型中包括 `null`（如果适用），可以与消费者沟通，看他们是否可以提供可空的值。
-此外，可以提供特定模板类型检查器的类型提示，请参阅本指南的 [输入设置器强制转型](guide/template-typecheck#input-setter-coercion)部分。
+此外，可以提供特定模板类型检查器的类型提示，请参阅本指南的[为自定义指令改进模板类型检查](guide/structural-directives#directive-type-checks)和[输入设置器强制转型](guide/template-typecheck#input-setter-coercion)部分。
{@a input-setter-coercion}
diff --git a/aio/content/guide/testing.md b/aio/content/guide/testing.md
index 5865f7f637..91617694e5 100644
--- a/aio/content/guide/testing.md
+++ b/aio/content/guide/testing.md
@@ -776,12 +776,11 @@ toggles the light's _on/off_ state and sets the message appropriately.
This component class has no dependencies. To test these types of classes, follow the same steps as you would for a service that has no dependencies:
-该组件类没有依赖。
-要测试一个没有依赖的服务，可以咨询与无依赖的服务相同的步骤：
+该组件类没有依赖。要测试这些类，请遵循与测试那些无依赖服务相同的步骤：
1. Create a component using the new keyword.
- 创建一个使用新关键字的组件。
+ 使用 `new` 关键子创建一个组件。
2. Poke at its API.
@@ -1903,13 +1902,14 @@ You do have to call [tick()](api/core/testing/tick) to advance the (virtual) clo
Calling [tick()](api/core/testing/tick) simulates the passage of time until all pending asynchronous activities finish.
In this case, it waits for the error handler's `setTimeout()`.
-调用 `tick()` 会模拟时光的流逝，直到所有未决的异步活动都结束为止。
+调用 [`tick()`](api/core/testing/tick) 会模拟时光的流逝，直到所有未决的异步活动都结束为止。
在这个例子中，它会等待错误处理器中的 `setTimeout()`。
The [tick()](api/core/testing/tick) function accepts milliseconds and tickOptions as parameters, the millisecond (defaults to 0 if not provided) parameter represents how much the virtual clock advances. For example, if you have a `setTimeout(fn, 100)` in a `fakeAsync()` test, you need to use tick(100) to trigger the fn callback. The tickOptions is an optional parameter with a property called `processNewMacroTasksSynchronously` (defaults to true) represents whether to invoke new generated macro tasks when ticking.
-`tick()` 函数接受一个毫秒值作为参数（如果没有提供则默认为 0）。该参数表示虚拟时钟要前进多少。
+[tick()](api/core/testing/tick) 函数接受一个毫秒值和一个 `tickOptions` 作为参数（如果没有提供毫秒值则默认为 0）。该参数表示虚拟时钟要前进多少。
比如，如果你的 `fakeAsync()` 测试中有一个 `setTimeout(fn, 100)` 函数，你就需要用 `tick(100)` 来触发它的 fn 回调。
+`tickOptions` 是一个可选参数，具有名为 `processNewMacroTasksSynchronously`（默认为 `true`）的属性，表示是否要在滴答时调用新生成的宏任务。
@@ -5579,15 +5579,15 @@ as the application source code files that they test:
#### Place your spec files in a test folder
-#### 什么时候我该把测试文件放进单独的 `test` 文件夹中？
+#### 把测试文件放进 `test` 文件夹中
Application integration specs can test the interactions of multiple parts
spread across folders and modules.
They don't really belong to any part in particular, so they don't have a
natural home next to any one file.
-应用程序的整合测试 spec 文件可以测试横跨多个目录和模块的多个部分之间的互动。
-它们不属于任何部分，很自然，没有特别的地方存放它们。
+应用程序的集成测试 spec 文件可以测试横跨多个目录和模块的多个部分之间的互动。
+它们不属于任何部分，自然也没有专门的地方存放它们。
It's often better to create an appropriate folder for them in the `tests` directory.
@@ -5608,7 +5608,7 @@ next to their corresponding helper files.
It should test only a single unit. On a first glance, you should be able to understand
what the test is testing. If it's doing more, then it doesn't belong here.
-[组件类测试](#component-class-testing)应该保持非常干净和简单。它应该只测试一个单元。应该乍一看就能了解测试的内容。如果还要做更多事，那它就不属于这里。
+[组件类测试](#component-class-testing)应该保持非常干净和简单。它应该只测试一个单元。应该一眼就能了解测试的内容。如果还要做更多事，那它就不属于这里。
{@a q-end-to-end}
diff --git a/aio/content/guide/universal.md b/aio/content/guide/universal.md
index 5c650b5313..2a22b1504d 100644
--- a/aio/content/guide/universal.md
+++ b/aio/content/guide/universal.md
@@ -30,7 +30,7 @@ The CLI schematic `@nguniversal/express-engine` performs the required steps, as
**Note:** Download the finished sample code,
which runs in a [Node.js® Express](https://expressjs.com/) server.
-你可以[下载最终的范例代码](generated/zips/universal/universal.zip)，并将其运行在一个 [Node.js® Express](https://expressjs.com/) 服务器中。
+ **注意：** 下载已完成的范例代码，并将其运行在一个 [Node.js® Express](https://expressjs.com/) 服务器中。
1. To display the names of the products, use the interpolation syntax `{{ }}`. Interpolation renders a property's value as text. Inside the `
`, add an `
` to display the interpolation of the product's name property:
@@ -259,7 +259,7 @@ In the process, you've learned to use five common features of Angular's template
For a fuller introduction to Angular's template syntax, see [Introduction to components and templates](guide/architecture-components#template-syntax "Template Syntax").
-要了解关于 Angular 模板语法全部特性的信息，请参阅[模板语法指南](guide/template-syntax "模板语法")。
+对 Angular 模板语法全的完整介绍，请参阅[组件与模板简介](guide/architecture-components#template-syntax "模板语法")。
@@ -347,7 +347,7 @@ The next section expands the app's capabilities by adding a new component—
For more information about components and how they interact with templates, see [Introduction to Components](guide/architecture-components "Concepts > Introduction to Components and Templates").
-要了解关于组件及其与模板交互的更多信息，请参阅[“组件简介”](guide/architecture-components "架构>组件简介")。
+要了解关于组件及其与模板交互的更多信息，请参阅[“组件简介”](guide/architecture-components "概念>组件与模板介绍")。
@@ -581,8 +581,8 @@ To continue exploring Angular, choose either of the following options:
* [Continue to the "In-app navigation" section](start/start-routing "Try it: In-app navigation") to create a product details page that can be accessed by clicking a product name and that has its own URL pattern.
- [继续浏览“路由”部分](start/start-routing "入门：路由")，创建一个商品详情页面，通过单击商品名称，可以访问该页面，该页面有自己的 URL 模式。
+ [继续浏览“应用内导航”部分](start/start-routing "入门：路由")以创建一个商品详情页面，通过单击商品名称，可以访问该页面，该页面有自己的 URL 模式。
* [Skip ahead to the "Deployment" section](start/start-deployment "Try it: Deployment") to move to local development, or deploy your app to Firebase or your own server.
- [跳到“部署”部分，](start/start-deployment "入门：部署")把你的应用转移到本地开发、部署到 Firebase 或你自己的服务器。
+ [跳到“部署”部分，](start/start-deployment "试一试：部署")把你的应用转移到本地开发、部署到 Firebase 或你自己的服务器。
diff --git a/aio/content/start/start-data.md b/aio/content/start/start-data.md
index 2e2c8ce1cd..7b2925c02c 100644
--- a/aio/content/start/start-data.md
+++ b/aio/content/start/start-data.md
@@ -5,7 +5,7 @@
At the end of [In-app Navigation](start/start-routing "Try it: In-app Navigation"), the online store application has a product catalog with two views: a product list and product details.
Users can click on a product name from the list to see details in a new view, with a distinct URL, or route.
-在[路由](start/start-routing "入门：路由")的末尾，本应用实现了一个包含两个视图的商品名录：商品列表和商品详情。用户点击清单中的某个商品名称，就会在新视图中看到具有专门的 URL 或路由的详情页。
+在[应用内导航](start/start-routing "试一试：应用内导航")的末尾，本应用实现了一个包含两个视图的商品名录：商品列表和商品详情。用户点击清单中的某个商品名称，就会在新视图中看到具有专门的 URL 或路由的详情页。
This page guides you through creating the shopping cart in three phases:
@@ -13,7 +13,7 @@ This page guides you through creating the shopping cart in three phases:
* Update the product details view to include a "Buy" button, which adds the current product to a list of products that a cart service manages.
- 修改商品详情页，让它包含一个 “Buy” 按钮，它会把当前商品添加到由 "购物车服务" 管理的商品列表中。
+ 修改商品详情视图，让它包含一个 “Buy” 按钮，它会把当前商品添加到由 "购物车服务" 管理的商品列表中。
* Add a cart component, which displays the items in the cart.
@@ -204,7 +204,7 @@ This section walks you through using the cart service to add a product to the ca
## Create the cart view
-## 创建购物车页面
+## 创建购物车视图
At this point, users can put items in the cart by clicking "Buy", but they can't yet see their cart.
@@ -212,11 +212,11 @@ At this point, users can put items in the cart by clicking "Buy", but they can't
Create the cart view in two steps:
-分两步创建购物车页面：
+分两步创建购物车视图：
1. Create a cart component and configure routing to the new component. At this point, the cart view has only default text.
- 创建一个购物车组件并配置指向这个新组件的路由。此时，购物车页面只会显示默认文本。
+ 创建一个购物车组件并配置指向这个新组件的路由。此时，购物车视图只会显示默认文本。
1. Display the cart items.
@@ -228,7 +228,7 @@ Create the cart view in two steps:
To create the cart view, begin by following the same steps you did to create the product details component and configure routing for the new component.
- 要创建购物车页面，首先要执行与创建商品详情组件相同的步骤，并为这个新组件设置路由。
+ 要创建购物车视图，首先要执行与创建商品详情组件相同的步骤，并为这个新组件设置路由。
1. Generate a cart component, named `cart`.
@@ -346,7 +346,7 @@ You can use services to share data across components:
1. Click on "My Store" to go to the product list view.
- 点击“My Store”，进入商品列表页面。
+ 点击“My Store”，进入商品列表视图。
1. Click on a product name to display its details.
@@ -376,7 +376,7 @@ You can use services to share data across components:
StackBlitz tip: Any time the preview refreshes, the cart is cleared. If you make changes to the app, the page refreshes, so you'll need to buy products again to populate the cart.
-StackBlitz 提示：只要预览刷新，就会清除购物车。如果你对该应用进行了更改，页面就会刷新，你需要重新购买商品来填充购物车。
+StackBlitz 提示：只要预览刷新，就会清除购物车。如果你对该应用进行了更改，视图就会刷新，你需要重新购买商品来填充购物车。
@@ -384,7 +384,7 @@ StackBlitz 提示：只要预览刷新，就会清除购物车。如果你对该
For more information about services, see [Introduction to Services and Dependency Injection](guide/architecture-services "Concepts > Intro to Services and DI").
-要了解关于[服务](guide/architecture-services "架构>服务简介和 DI")的更多信息，请参阅[“服务和依赖注入简介”](guide/architecture-services "架构>服务简介和 DI")。
+要了解关于服务的更多信息，请参阅[“服务和依赖注入简介”](guide/architecture-services "概念>服务简介和 DI")。
@@ -504,13 +504,13 @@ First, define a `get()` method.
For more information about Angular's `HttpClient`, see the [Client-Server Interaction](guide/http "Server interaction through HTTP") guide.
-要了解关于 Angular `HttpClient` 的更多信息，请参阅[HttpClient 指南](guide/http "HttpClient 指南")。
+要了解关于 Angular `HttpClient` 的更多信息，请参阅[客户端-服务器集成](guide/http "HttpClient 指南")指南。
## Define the shipping view
-## 定义配送页面
+## 定义配送视图
Now that your app can retrieve shipping data, create a shipping component and template.
@@ -577,7 +577,7 @@ Now that your app can retrieve shipping data, create a shipping component and t
1. Add a link from the cart view to the shipping view:
- 在购物车页面中添加一个到配送页面的链接：
+ 在购物车视图中添加一个到配送视图的链接：
@@ -615,9 +615,9 @@ To continue exploring Angular, choose either of the following options:
* [Continue to the "Forms" section](start/start-forms "Try it: Forms for User Input") to finish the app by adding the shopping cart view and a checkout form.
- [继续浏览“表单”部分](start/start-forms "入门：表单")，通过添加购物车页面和一个结账表单来完成该应用。
+ [继续浏览“表单”部分](start/start-forms "试一试：用表单接收用户输入")，通过添加购物车视图和一个结账表单来完成该应用。
* [Skip ahead to the "Deployment" section](start/start-deployment "Try it: Deployment") to move to local development, or deploy your app to Firebase or your own server.
- [跳到“部署”部分，](start/start-deployment "入门：部署")把你的应用部署到 Firebase 或转成本地开发。
+ [跳到“部署”部分，](start/start-deployment "试一试：部署")把你的应用部署到 Firebase 或转成本地开发。
diff --git a/aio/content/start/start-deployment.md b/aio/content/start/start-deployment.md
index 856a077b53..aa26c05b1c 100644
--- a/aio/content/start/start-deployment.md
+++ b/aio/content/start/start-deployment.md
@@ -10,7 +10,7 @@ To deploy your application, you have to compile it, and then host the JavaScript
Whether you came here directly from [Part 1](start "Try it: A basic app"), or completed the entire online store application through the [In-app navigation](start/start-routing "Try it: In-app navigation"), [Manage data](start/start-data "Try it: Manage data"), and [Forms for user input](start/start-forms "Try it: Forms for user input") sections, you have an application that you can deploy by following the instructions in this section.
-无论你是从[你的第一个应用](start "入门：你的第一个应用")直接来到这里，还是经过[路由](start/start-routing "入门：路由")、[管理数据](start/start-data "入门：管理数据")和[表单](start/start-forms "入门：表单")部分，完成了整个在线商店应用之后来到这里，都可以按照本节中的说明进行部署。
+无论你是从[第一部分](start "入门：你的第一个应用")直接来到这里，还是经过[应用内导航](start/start-routing "入门：路由")、[管理数据](start/start-data "入门：管理数据")和[用表单接收用户输入](start/start-forms "入门：表单")部分，完成了整个在线商店应用之后来到这里，都可以按照本节中的说明进行部署。
@@ -44,11 +44,11 @@ StackBlitz 项目默认是公开的，你可以通过项目的 URL 来共享你
To build your application locally or for production, download the source code from your StackBlitz project by clicking the `Download Project` icon in the left menu across from `Project` to download your files.
-要在本地构建应用或未生产环境构建应用，你需要从 StackBlitz 项目中下载源代码。单击左侧菜单中的 `Download Project` 图标以下载文件。
+要在本地构建应用或未生产环境构建应用，就要从 StackBlitz 项目中下载源代码。单击左侧菜单中的 `Download Project` 图标以下载文件。
Once you have the source code downloaded and unzipped, use the [Angular Console](https://angularconsole.com "Angular Console web site") to serve the application, or install `Node.js` and serve your app with the Angular CLI.
-下载并解压源代码后，就可以使用 [Angular Console](https://angularconsole.com "Angular Console 的网站") 来启动开发服务器了，也可以先安装 `Node.js` 再安装 Angular CLI。
+下载并解压源代码后，就可以使用 [Angular Console](https://angularconsole.com "Angular Console 的网站") 来启动开发服务器了，也可以先安装 `Node.js` 再使用 Angular CLI 来启动开发服务器。
From the terminal, install the Angular CLI globally with:
@@ -72,7 +72,7 @@ ng new my-project-name
In your new CLI generated app, replace the `/src` folder with the one from your `StackBlitz` download, and then perform a build.
-进入你从 `StackBlitz` 下载的 `/src` 文件夹，然后执行 build 命令。
+在 CLI 生成的新应用中，将其 `/src` 目录替换成你从 `StackBlitz` 下载的同名目录，然后进行构建。
```sh
ng build --prod
@@ -96,7 +96,7 @@ If the above `ng build` command throws an error about missing packages, append t
The files in the `dist/my-project-name` folder are static. This means you can host them on any web server capable of serving files (such as `Node.js`, Java, .NET), or any backend (such as Firebase, Google Cloud, or App Engine).
-`dist/my-project-name` 文件夹中的文件都是静态的，可以托管在任何能够提供文件服务的 Web 服务器上（`Node.js`，Java，.NET），也可以是任何后端（Firebase，Google Cloud，App Engine 等）。
+`dist/my-project-name` 文件夹中的文件都是静态的，可以托管在任何能够提供文件服务的 Web 服务器上（比如 `Node.js`，Java，.NET），也可以是任何后端（比如 Firebase，Google Cloud，App Engine 等）。
### Hosting an Angular app on Firebase
@@ -116,7 +116,8 @@ One of the easiest ways to get your site live is to host it using Firebase.
1. Add the `@angular/fire` schematics that will handle your deployment using `ng add @angular/fire`.
- 使用 `npm install -g firebase-tools` 安装 `firebase-tools` CLI 来处理你的部署。
+ 添加 `@angular/fire` 原理图，它将使用 `ng add @angular/fire` 来处理你的发布。
+
1. Connect your CLI to your Firebase account and initialize the connection to your project using `firebase login` and `firebase init`.
把你的 CLI 和 Firebase 帐户联系起来，使用 `firebase login` 和 `firebase init` 来初始化这个联系。
@@ -139,7 +140,8 @@ One of the easiest ways to get your site live is to host it using Firebase.
1. Deploy your application with `ng deploy`.
- 用 `firebase deploy` 命令部署你的应用，这是因为 `firebase init` 命令已经创建了一个 `firebase.json`，它会告诉 Firebase 如何用你的应用提供服务。
+ 用 `ng deploy` 命令部署你的应用。
+
1. Once deployed, visit https://your-firebase-project-name.firebaseapp.com to see it live!
部署之后，访问 进行实时查看！
@@ -156,11 +158,11 @@ Read more about development and distribution of your application in the [Buildin
## Join the Angular community
-## 加入我们的社区
+## 加入 Angular 社区
You are now an Angular developer! [Share this moment](https://twitter.com/intent/tweet?url=https://angular.io/start&text=I%20just%20finished%20the%20Angular%20Getting%20Started%20Tutorial "Angular on Twitter"), tell us what you thought of this get-started exercise, or submit [suggestions for future editions](https://github.com/angular/angular/issues/new/choose "Angular GitHub repository new issue form").
-你现在是一位 Angular 的开发者了！[分享这一刻](https://twitter.com/intent/tweet?url=https://next.angular.io/getting-started&text=I%20just%20finished%20the%20Angular%20Getting%20Started%20Tutorial "Angular on Twitter")，告诉我们你对这份“入门文档”的看法，或者[为今后的版本](https://github.com/angular/angular/issues/new/choose "Angular GitHub 存储库中的新问题表单")提交[建议](https://github.com/angular/angular/issues/new/choose "Angular GitHub 存储库中的新问题表单")。
+你现在是一位 Angular 的开发者了！[分享这一刻](https://twitter.com/intent/tweet?url=https://next.angular.io/getting-started&text=I%20just%20finished%20the%20Angular%20Getting%20Started%20Tutorial "Angular on Twitter")，告诉我们你对这份“快速上手”的看法，或者[为今后的版本](https://github.com/angular/angular/issues/new/choose "Angular GitHub 存储库中的新问题表单")提交[建议](https://github.com/angular/angular/issues/new/choose "Angular GitHub 存储库中的新问题表单")。
Angular offers many more capabilities, and you now have a foundation that empowers you to build an application and explore those other capabilities:
diff --git a/aio/content/start/start-forms.md b/aio/content/start/start-forms.md
index c8554a30a8..039836eb6d 100644
--- a/aio/content/start/start-forms.md
+++ b/aio/content/start/start-forms.md
@@ -89,7 +89,7 @@ Now that you've defined the form model in the component class, you need a checko
Use the following steps to add a checkout form at the bottom of the "Cart" view.
-使用下列步骤在“购物车”页面的底部添加一个结帐表单。
+使用下列步骤在“购物车”视图的底部添加一个结帐表单。
1. Open `cart.component.html`.
@@ -142,5 +142,5 @@ Congratulations! You have a complete online store application with a product cat
[Continue to the "Deployment" section](start/start-deployment "Try it: Deployment") to move to local development, or deploy your app to Firebase or your own server.
-[继续浏览“部署”部分，](start/start-deployment "入门：部署")把你的应用转移到本地开发、部署到 Firebase 或你自己的服务器。
+[继续浏览“部署”部分，](start/start-deployment "试一试：部署")把你的应用转移到本地开发、部署到 Firebase 或你自己的服务器。
diff --git a/aio/content/start/start-routing.md b/aio/content/start/start-routing.md
index 2e51f50af0..4777c6cdbc 100644
--- a/aio/content/start/start-routing.md
+++ b/aio/content/start/start-routing.md
@@ -6,15 +6,15 @@ At the end of [part 1](start "Get started with a basic Angular app"), the online
The app doesn't have any variable states or navigation.
There is one URL, and that URL always displays the "My Store" page with a list of products and their descriptions.
-在[你的第一个应用](start "入门：你的第一个应用")结束时，这个在线商店应用会有一个基本的商品名录。该应用还没有任何可变的状态或导航。它只有一个 URL，该 URL 总是会显示“我的商店”页面，其中是商品列表及其描述。
+在[第一部分](start "入门：你的第一个应用")结束时，这个在线商店应用会有一个基本的商品名录。该应用还没有任何可变的状态或导航。它只有一个 URL，该 URL 总是会显示“我的商店”页面，其中是商品列表及其描述。
This guide shows you how to use Angular [routing](guide/glossary#router "Router definition") to give the user in-app navigation. In a single-page app, instead of loading new pages, you show different components and data to the user based on where the user is in the application.
-本指南会教你如何使用 Angular 路由器来用一些独立页面显示完整的产品详情，这些页面有自己的 URL。
+本指南会告诉你如何使用 Angular [路由](guide/glossary#router "Router definition")来让用户进行应用内导航。在单页面应用中，你不会重新加载新页面，而是根据用户所在的位置，向他显示不同的组件和数据。
The router lets you display full product details in separate [views](guide/glossary#view "View definition"), each with its own URL. Routing enables navigation from one view to the next (within the same page) as users perform tasks such as the following:
-Angular [路由器](guide/glossary#router "Router definition")能让你根据用户在应用中的位置向用户显示不同的组件和数据。当用户执行应用任务时，路由器可以从一个视图导航到另一个视图。比如：
+Angular [路由器](guide/glossary#router "Router definition")能让你在不同的[视图](guide/glossary#view "View definition")中显示产品的详情，每个产品都有自己的 URL。当用户执行应用任务时，路由器可以从一个视图导航到另一个视图（但在同一个页面）。比如：
* Entering a URL in the address bar to navigate to a corresponding view.
@@ -23,6 +23,7 @@ Angular [路由器](guide/glossary#router "Router definition")能让你根据用
* Clicking links on the page to navigate to a new view.
点击页面上的链接，导航到新页面。
+
* Clicking the browser's back and forward buttons to navigate backward and forward through the browser history.
点击浏览器的后退和前进按钮，在浏览器的历史中前后导航。
@@ -33,7 +34,7 @@ Angular [路由器](guide/glossary#router "Router definition")能让你根据用
The app is already set up to use the Angular `Router` and to use routing to navigate to the product list component you modified earlier. This section shows you how to define a route to show individual product details.
-该应用已经设置为使用 Angular 路由器，并通过路由导航到之前修改过的商品列表组件。本节会向你展示如何定义一个可以显示单个商品详情的路由。
+该应用已经设置为使用 Angular `Router`，并通过路由导航到之前修改过的商品列表组件。本节会向你展示如何定义一个可以显示单个商品详情的路由。
1. Generate a new component for product details. Give the component the name `product-details`.
@@ -126,7 +127,7 @@ The product details component handles the display of each product. The Angular R
By injecting the `ActivatedRoute`, you are configuring the component to use a *service*. The [Managing Data](start/start-data "Try it: Managing Data") page covers services in more detail.
- 通过注入 `ActivatedRoute`，你把该组件配置成了使用服务的。《快速上手》教程中的这部分只是简略使用了该语法，在[管理数据](start/start-data "Getting Started: Managing Data")部分深入讲解了服务的更多细节。
+ 通过注入 `ActivatedRoute`，你把该组件配置成了使用服务的。《快速上手》教程中的这部分只是简略使用了该语法，在[管理数据](start/start-data "试一试: 管理数据")部分深入讲解了服务的更多细节。
1. In the `ngOnInit()` method, subscribe to route parameters and fetch the product based on the `productId`.
@@ -173,6 +174,7 @@ Congratulations! You have integrated routing into your online store.
* Products are linked from the product list view to individual products.
从商品列表页面链接到了单个商品。
+
* Users can click on a product name from the list to see details in a new view, with a distinct URL/route.
用户可以点击列表中的某个商品名称来在新视图中查看其详细信息，并带有显著的 URL/路由。
diff --git a/aio/content/tutorial/index.md b/aio/content/tutorial/index.md
index 89b36c7753..e6b3ab7842 100644
--- a/aio/content/tutorial/index.md
+++ b/aio/content/tutorial/index.md
@@ -43,15 +43,16 @@ By the end of this tutorial you will be able to do the following:
* Use built-in Angular [directives](guide/glossary#directive "Directives definition") to show and hide elements and display lists of hero data.
- 使用 Angular 的内置指令来显示 / 隐藏元素，并显示英雄数据的列表。
+ 使用 Angular 的内置[指令](guide/glossary#directive "Directives definition")来显示 / 隐藏元素，并显示英雄数据的列表。
* Create Angular [components](guide/glossary#component "Components definition") to display hero details and show an array of heroes.
- 创建 Angular 组件以显示英雄的详情，并显示一个英雄数组。
+ 创建 Angular [组件](guide/glossary#component "Components definition")以显示英雄的详情，并显示一个英雄数组。
* Use one-way [data binding](guide/glossary#data-binding "Data binding definition") for read-only data.
- 为只读数据使用单向数据绑定。
+ 为只读数据使用单向[数据绑定](guide/glossary#data-binding "Data binding definition")。
+
* Add editable fields to update a model with two-way data binding.
添加可编辑字段，使用双向数据绑定来更新模型。
@@ -63,17 +64,18 @@ By the end of this tutorial you will be able to do the following:
* Enable users to select a hero from a master list and edit that hero in the details view.
让用户可以在主列表中选择一个英雄，然后在详情视图中编辑他。
+
* Format data with [pipes](guide/glossary#pipe "Pipe definition").
- 使用管道来格式化数据。
+ 使用[管道](guide/glossary#pipe "Pipe definition")来格式化数据。
* Create a shared [service](guide/glossary#service "Service definition") to assemble the heroes.
- 创建共享的服务来管理这些英雄。
+ 创建共享的[服务](guide/glossary#service "Service definition")来管理这些英雄。
* Use [routing](guide/glossary#router "Router definition") to navigate among different views and their components.
- 使用路由在不同的视图及其组件之间导航。
+ 使用[路由](guide/glossary#router "Router definition")在不同的视图及其组件之间导航。
You'll learn enough Angular to get started and gain confidence that
Angular can do whatever you need it to do.
diff --git a/aio/content/tutorial/toh-pt2.md b/aio/content/tutorial/toh-pt2.md
index 141096b5ba..7d49a75e88 100644
--- a/aio/content/tutorial/toh-pt2.md
+++ b/aio/content/tutorial/toh-pt2.md
@@ -216,10 +216,10 @@ When the user clicks in the `
` 时，Angular 就会执行表达式 `onSelect(hero)`。
-`onSelect()` method in `HeroesComponent` to
+In the next section, define an `onSelect()` method in `HeroesComponent` to
display the hero that was defined in the `*ngFor` expression.
-`HeroesComponent` 上的 `onSelect()` 方法 用来显示 `*ngFor` 表达式所定义的那个英雄（`hero`）。
+下一部分，会在 `HeroesComponent` 上定义一个 `onSelect()` 方法，用来显示 `*ngFor` 表达式所定义的那个英雄（`hero`）。
### Add the click event handler
diff --git a/temp.md b/temp.md
new file mode 100644
index 0000000000..4617f533ad
--- /dev/null
+++ b/temp.md
@@ -0,0 +1,36 @@
+### Using absolute URLs for HTTP (data) requests on the server
+
+### 在服务器端使用HTTP（数据）请求的绝对URL
+
+
+The tutorial's `HeroService` and `HeroSearchService` delegate to the Angular `HttpClient` module to fetch application data.
+These services send requests to *relative* URLs such as `api/heroes`.
+In a server-side rendered app, HTTP URLs must be *absolute* (for example, `https://my-server.com/api/heroes`).
+This means that the URLs must be somehow converted to absolute when running on the server and be left relative when running in the browser.
+
+本教程的`HeroService`和`HeroSearchService`委托给Angular `HttpClient`模块来获取应用数据。这些服务会向`api/heroes`类的*相对* URL发送请求。在服务器端呈现的应用中，HTTP URL必须是*绝对的* （例如， `https://my-server.com/api/heroes` ）。这意味着当在服务器上运行时，URL必须以某种方式转换为绝对值，并且当在浏览器中运行时，它们是相对的。
+
+
+If you are using one of the `@nguniversal/*-engine` packages (such as `@nguniversal/express-engine`), this is taken care for you automatically.
+You don't need to do anything to make relative URLs work on the server.
+
+如果你正在使用其中一个`@nguniversal/*-engine`软件包（例如`@nguniversal/express-engine` ），这会自动为你服务。你无需做任何事情来让相对URL在服务器上运行。
+
+
+If, for some reason, you are not using an `@nguniversal/*-engine` package, you may need to handle it yourself.
+
+如果，出于某种原因，你没有使用`@nguniversal/*-engine`包，你可能需要亲自处理它。
+
+
+The recommended solution is to pass the full request URL to the `options` argument of [renderModule()](api/platform-server/renderModule) or [renderModuleFactory()](api/platform-server/renderModuleFactory) (depending on what you use to render `AppServerModule` on the server).
+This option is the least intrusive as it does not require any changes to the app.
+Here, "request URL" refers to the URL of the request as a response to which the app is being rendered on the server.
+For example, if the client requested `https://my-server.com/dashboard` and you are rendering the app on the server to respond to that request, `options.url` should be set to `https://my-server.com/dashboard`.
+
+建议的解决方案是将完整的请求URL传递给[renderModule（）](api/platform-server/renderModule)或[renderModuleFactory（）](api/platform-server/renderModuleFactory)的`options`参数（具体取决于你在服务器上渲染`AppServerModule`用途）。此选项的侵入性最小，因为它不需要对应用进行任何更改。这里，“request URL”指的是请求的URL，作为应用在服务器上呈现的响应。例如，如果客户端请求了`https://my-server.com/dashboard`并且要在服务器上渲染该应用来响应该请求，那么`options.url`应设置为`https://my-server.com/dashboard` 。
+
+
+Now, on every HTTP request made as part of rendering the app on the server, Angular can correctly resolve the request URL to an absolute URL, using the provided `options.url`.
+
+现在，作为在服务器上呈现应用的一部分，每次HTTP请求，Angular都可以使用提供的`options.url`正确地将请求URL解析为绝对URL。
+