iSharkFly-Docs/angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add auto checker

Browse Source 
fix: some translations found by auto checker
This commit is contained in:
Zhicheng Wang 2018-03-01 22:19:59 +08:00
parent 1b786e0a72
commit 53a7a4cbf5
33 changed files with 333 additions and 228 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
aio/content/dict/checker.spec.ts Normal file
View File

@ -0,0 +1,35 @@
import { expect } from 'chai';
import { DictEntry } from './dict-entry';
import { gatherFromMarkdownFiles, isTranslation } from './extractor';
describe('auto check translations', function () {
const entries = gatherFromMarkdownFiles(__dirname + '/../');
it('should not have <code-example> in translation', function () {
const codeExamples = entries.filter(entry => entry.translation.indexOf('<code-example') !== -1);
expect(codeExamples).eql([]);
});
it('english should not be translations', function () {
const lines = entries.filter(entry => isTranslation(entry.original))
.filter(isNotImg)
.filter(isNotCheatSheet)
.filter(isNotMarketingDocs)
.filter(isNotCnPages);
expect(lines).eql([]);
});
});
function isNotImg(entry: DictEntry): boolean {
return !/^<(img|figure)/.test(entry.translation);
}
function isNotCheatSheet(entry: DictEntry): boolean {
return !/cheatsheet.md$/.test(entry.sourceFile);
}
function isNotMarketingDocs(entry: DictEntry): boolean {
return !/marketing\/docs.md$/.test(entry.sourceFile);
}
function isNotCnPages(entry: DictEntry): boolean {
return !/cn\/.*?.md$/.test(entry.sourceFile);
}

292
aio/content/dict/dict-3.json
View File

@ -311,7 +311,7 @@
}, },
{ {
"original": "In AngularJS, the `ng-href` is often used to activate a route as part of navigation.", "original": "In AngularJS, the `ng-href` is often used to activate a route as part of navigation.",
"translation": "在AngularJS 中，`ng-href`通常用来作为导航的一部分，激活一个路由。\n <code-example hideCopy format=\"\">\n &lt;a ng-href=\"#{{ moviesHash }}\">Movies&lt;/a>\n </code-example>", "translation": "在AngularJS 中，`ng-href`通常用来作为导航的一部分，激活一个路由。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
@ -565,12 +565,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
"original": "<td>", "original": "### none",
"translation": "### none\n ### 没了\n For performance reasons, no comparable pipe exists in Angular. Do all your filtering in the component. If you need the same filtering code in several templates, consider building a custom pipe.", "translation": "### 没了",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
"original": "### none\n ### 没了\n For performance reasons, no comparable pipe exists in Angular. Do all your filtering in the component. If you need the same filtering code in several templates, consider building a custom pipe.", "original": "For performance reasons, no comparable pipe exists in Angular. Do all your filtering in the component. If you need the same filtering code in several templates, consider building a custom pipe.",
"translation": "在Angular中，出于性能的考虑，并没有一个类似的管道。\n 过滤逻辑应该在组件中用代码实现。\n 如果它将被复用在几个模板中，可以考虑构建一个自定义管道。", "translation": "在Angular中，出于性能的考虑，并没有一个类似的管道。\n 过滤逻辑应该在组件中用代码实现。\n 如果它将被复用在几个模板中，可以考虑构建一个自定义管道。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
@ -625,12 +625,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
"original": "<td>", "original": "### none",
"translation": "### none\n ### 没了\n For performance reasons, no comparable pipe exists in Angular.\n Instead, use component code to order or sort results. If you need the same ordering or sorting code in several templates, consider building a custom pipe.", "translation": "### 没了",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
"original": "### none\n ### 没了\n For performance reasons, no comparable pipe exists in Angular.\n Instead, use component code to order or sort results. If you need the same ordering or sorting code in several templates, consider building a custom pipe.", "original": "For performance reasons, no comparable pipe exists in Angular.\n Instead, use component code to order or sort results. If you need the same ordering or sorting code in several templates, consider building a custom pipe.",
"translation": "在Angular中，出于性能的考虑，并没有一个类似的管道。\n 排序逻辑应该在组件中用代码实现。\n 如果它将被复用在几个模板中，可以考虑构建一个自定义管道。", "translation": "在Angular中，出于性能的考虑，并没有一个类似的管道。\n 排序逻辑应该在组件中用代码实现。\n 如果它将被复用在几个模板中，可以考虑构建一个自定义管道。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
@ -706,7 +706,7 @@
}, },
{ {
"original": "### Controller registration", "original": "### Controller registration",
"translation": "### 控制器注册 <code-example hideCopy>\n angular\n .module(\"movieHunter\")\n .controller(\"MovieListCtrl\",\n [\"movieService\",\n MovieListCtrl]);\n </code-example>", "translation": "### 控制器注册",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ajs-quick-reference.md"
}, },
{ {
@ -845,8 +845,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md"
}, },
{ {
"original": "动画是现代Web应用设计中一个很重要的方面。我们希望用户界面能在不同的状态之间更平滑的转场。如果需要，还可以用适当的动画来吸引注意力。\n设计良好的动画不但会让UI更有趣，还会让它更容易使用。", "original": "## Overview",
"translation": "## Overview\n## 概述", "translation": "## 概述",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md"
}, },
{ {
@ -1240,8 +1240,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md"
}, },
{ {
"original": "其中一个动画组对元素的`transform`和`width`做动画，另一个组则对`opacity`做动画。", "original": "## Animation callbacks",
"translation": "## Animation callbacks\n## 动画回调", "translation": "## 动画回调",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/animations.md"
}, },
{ {
@ -1284,11 +1284,6 @@
"translation": "## 概览", "translation": "## 概览",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/aot-compiler.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/aot-compiler.md"
}, },
{
"original": "<code-example language=\"sh\" class=\"code-shell\">\n ng build --aot\n ng serve --aot\n</code-example>",
"translation": "Angular应用主要包含组件和它们的HTML模板。\n在浏览器可以渲染应用之前，组件和模板必须要被**Angular编译器**转换为可以执行的JavaScript。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/aot-compiler.md"
},
{ {
"original": "See the [CLI documentation](https://github.com/angular/angular-cli/wiki) for details, especially the [`build` topic](https://github.com/angular/angular-cli/wiki/build).", "original": "See the [CLI documentation](https://github.com/angular/angular-cli/wiki) for details, especially the [`build` topic](https://github.com/angular/angular-cli/wiki/build).",
"translation": "要了解更多，请参见[CLI 文档](https://github.com/angular/angular-cli/wiki)，特别是[`build` 这个主题](https://github.com/angular/angular-cli/wiki/build)。", "translation": "要了解更多，请参见[CLI 文档](https://github.com/angular/angular-cli/wiki)，特别是[`build` 这个主题](https://github.com/angular/angular-cli/wiki/build)。",
@ -1635,8 +1630,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/architecture.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/architecture.md"
}, },
{ {
"original": "每个 Angular 库的名字都带有`@angular`前缀。", "original": "You install them with the **npm** package manager and import parts of them with JavaScript `import` statements.",
"translation": "You install them with the **npm** package manager and import parts of them with JavaScript `import` statements.\n用 **npm** 包管理工具安装它们，用 JavaScript 的`import`语句导入其中某些部件。<br class=\"clear\">", "translation": "用 **npm** 包管理工具安装它们，用 JavaScript 的`import`语句导入其中某些部件。<br class=\"clear\">",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/architecture.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/architecture.md"
}, },
{ {
@ -2451,7 +2446,7 @@
}, },
{ {
"original": "To use the new `HighlightDirective`, add a paragraph (`<p>`) element to the template of the root `AppComponent` and apply the directive as an attribute.", "original": "To use the new `HighlightDirective`, add a paragraph (`<p>`) element to the template of the root `AppComponent` and apply the directive as an attribute.",
"translation": "运行应用，就会看到我们的指令确实高亮了段落中的文本。<code-example path=\"attribute-directives/src/app/app.component.1.html\" title=\"src/app/app.component.html\" region=\"applied\"></code-example>", "translation": "运行应用，就会看到我们的指令确实高亮了段落中的文本。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md"
}, },
{ {
@ -2535,7 +2530,7 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md"
}, },
{ {
"original": "Begin by adding `Input` to the list of symbols imported from `@angular/core`.\n<code-example path=\"attribute-directives/src/app/highlight.directive.3.ts\" linenums=\"false\" title=\"src/app/highlight.directive.ts (imports)\" region=\"imports\"></code-example>", "original": "Begin by adding `Input` to the list of symbols imported from `@angular/core`.",
"translation": "我们先从`@angular/core`中导入`Input`。", "translation": "我们先从`@angular/core`中导入`Input`。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/attribute-directives.md"
}, },
@ -3056,11 +3051,11 @@
}, },
{ {
"original": "## All mention of moduleId removed. \"Component relative paths\" guide deleted (2017-03-13)", "original": "## All mention of moduleId removed. \"Component relative paths\" guide deleted (2017-03-13)",
"translation": "## 移除了所有的moduleId引用。移除了“组件相对路径” 的烹饪书。(2017-03-13)\nWe added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration.\nThis plugin dynamically converts \"component-relative\" paths in templateUrl and styleUrls to \"absolute paths\" for you.", "translation": "## 移除了所有的moduleId引用。移除了“组件相对路径” 的烹饪书。(2017-03-13)",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
{ {
"original": "## 移除了所有的moduleId引用。移除了“组件相对路径” 的烹饪书。(2017-03-13)\nWe added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration.\nThis plugin dynamically converts \"component-relative\" paths in templateUrl and styleUrls to \"absolute paths\" for you.", "original": "We added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration.\nThis plugin dynamically converts \"component-relative\" paths in templateUrl and styleUrls to \"absolute paths\" for you.",
"translation": "我们往建议的SystemJS配置中新增了一个SystemJS插件 (systemjs-angular-loader.js) 。\n这个插件可以帮你把templateUrl和styleUrls中的组件相对路径动态转换为绝对路径。", "translation": "我们往建议的SystemJS配置中新增了一个SystemJS插件 (systemjs-angular-loader.js) 。\n这个插件可以帮你把templateUrl和styleUrls中的组件相对路径动态转换为绝对路径。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
@ -3286,11 +3281,11 @@
}, },
{ {
"original": "The updated TypeScript to JavaScript guide explains how to write apps in ES6/7", "original": "The updated TypeScript to JavaScript guide explains how to write apps in ES6/7",
"translation": "更新了“[从TypeScript到JavaScript](guide/ts-to-js)”烹饪宝典，解释如何使用ES6/7编写应用\nby translating the common idioms in the TypeScript documentation examples\n(and elsewhere on the web) to ES6/7 and ES5.", "translation": "更新了“[从TypeScript到JavaScript](guide/ts-to-js)”烹饪宝典，解释如何使用ES6/7编写应用",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
{ {
"original": "更新了“[从TypeScript到JavaScript](guide/ts-to-js)”烹饪宝典，解释如何使用ES6/7编写应用\nby translating the common idioms in the TypeScript documentation examples\n(and elsewhere on the web) to ES6/7 and ES5.", "original": "by translating the common idioms in the TypeScript documentation examples\n(and elsewhere on the web) to ES6/7 and ES5.",
"translation": "将TypeScript文档示例中（以及网站其它地方）的习惯用法翻译成ES6/7和ES5。", "translation": "将TypeScript文档示例中（以及网站其它地方）的习惯用法翻译成ES6/7和ES5。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
@ -3436,11 +3431,11 @@
}, },
{ {
"original": "[StyleGuide](guide/styleguide) explains recommended conventions for NgModules.", "original": "[StyleGuide](guide/styleguide) explains recommended conventions for NgModules.",
"translation": "[StyleGuide](guide/styleguide)解释了我们为Angular模块（NgModule）而推荐的约定。\nBarrels now are far less useful and have been removed from the style guide;\nthey remain valuable but are not a matter of Angular style.\nAlso relaxed the rule that discouraged use of the `@Component.host` property.", "translation": "[StyleGuide](guide/styleguide)解释了我们为Angular模块（NgModule）而推荐的约定。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
{ {
"original": "[StyleGuide](guide/styleguide)解释了我们为Angular模块（NgModule）而推荐的约定。\nBarrels now are far less useful and have been removed from the style guide;\nthey remain valuable but are not a matter of Angular style.\nAlso relaxed the rule that discouraged use of the `@Component.host` property.", "original": "Barrels now are far less useful and have been removed from the style guide;\nthey remain valuable but are not a matter of Angular style.\nAlso relaxed the rule that discouraged use of the `@Component.host` property.",
"translation": "现在，封装桶不再那么重要，风格指南已经移除了它们。\n它们仍然很有价值，但是它们与Angular风格无关。\n我们同时对**不推荐使用`@Component.host`属性**的规则有所放宽。", "translation": "现在，封装桶不再那么重要，风格指南已经移除了它们。\n它们仍然很有价值，但是它们与Angular风格无关。\n我们同时对**不推荐使用`@Component.host`属性**的规则有所放宽。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/change-log.md"
}, },
@ -3475,12 +3470,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md"
}, },
{ {
"original": "<h1 class=\"no-toc\">速查表</h1>", "original": "<div id=\"cheatsheet\">",
"translation": "<div id=\"cheatsheet\">\n<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th>\n<p>Bootstrapping</p>\n<p>启动</p>\n</th>\n<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code><b>platformBrowserDynamic().bootstrapModule</b>(AppModule);</code></td>\n<td><p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>\n<p>用 <code>NgModule</code> 中指定的根组件进行启动。</p>\n</td>\n</tr>\n</tbody></table>", "translation": "<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th>\n<p>Bootstrapping</p>\n<p>启动</p>\n</th>\n<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code><b>platformBrowserDynamic().bootstrapModule</b>(AppModule);</code></td>\n<td><p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>\n<p>用 <code>NgModule</code> 中指定的根组件进行启动。</p>\n</td>\n</tr>\n</tbody></table>",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md"
}, },
{ {
"original": "<div id=\"cheatsheet\">\n<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th>\n<p>Bootstrapping</p>\n<p>启动</p>\n</th>\n<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code><b>platformBrowserDynamic().bootstrapModule</b>(AppModule);</code></td>\n<td><p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>\n<p>用 <code>NgModule</code> 中指定的根组件进行启动。</p>\n</td>\n</tr>\n</tbody></table>", "original": "<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th>\n<p>Bootstrapping</p>\n<p>启动</p>\n</th>\n<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code><b>platformBrowserDynamic().bootstrapModule</b>(AppModule);</code></td>\n<td><p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>\n<p>用 <code>NgModule</code> 中指定的根组件进行启动。</p>\n</td>\n</tr>\n</tbody></table>",
"translation": "<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th><p>NgModules</p>\n<p>Angular 模块</p>\n</th>\n<th><p><code>import { NgModule } from '@angular/core';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code>@<b>NgModule</b>({ declarations: ..., imports: ...,<br> exports: ..., providers: ..., bootstrap: ...})<br>class MyModule {}</code></td>\n<td><p>Defines a module that contains components, directives, pipes, and providers.</p>\n<p>定义一个模块，其中可以包含组件、指令、管道和服务提供商。</p>\n</td>\n</tr><tr>\n<td><code><b>declarations:</b> [MyRedComponent, MyBlueComponent, MyDatePipe]</code></td>\n<td><p>List of components, directives, and pipes that belong to this module.</p>\n<p>属于当前模块的组件、指令和管道的列表。</p>\n</td>\n</tr><tr>\n<td><code><b>imports:</b> [BrowserModule, SomeOtherModule]</code></td>\n<td><p>List of modules to import into this module. Everything from the imported modules\nis available to <code>declarations</code> of this module.</p>\n<p>本模块所导入的模块列表</p>\n</td>\n</tr><tr>\n<td><code><b>exports:</b> [MyRedComponent, MyDatePipe]</code></td>\n<td><p>List of components, directives, and pipes visible to modules that import this module.</p>\n<p>那些导入了本模块的模块所能看到的组件、指令和管道的列表</p>\n</td>\n</tr><tr>\n<td><code><b>providers:</b> [MyService, { provide: ... }]</code></td>\n<td><p>List of dependency injection providers visible both to the contents of this module and to importers of this module.</p>\n<p>依赖注入提供商的列表，本模块以及本模块导入的所有模块中的内容都可以看见它们。</p>\n</td>\n</tr><tr>\n<td><code><b>bootstrap:</b> [MyAppComponent]</code></td>\n<td><p>List of components to bootstrap when this module is bootstrapped.</p>\n<p>当本模块启动时，随之启动的组件列表。</p>\n</td>\n</tr>\n</tbody></table>", "translation": "<table class=\"is-full-width is-fixed-layout\">\n<tbody><tr>\n<th><p>NgModules</p>\n<p>Angular 模块</p>\n</th>\n<th><p><code>import { NgModule } from '@angular/core';</code>\n</p>\n</th>\n</tr>\n<tr>\n<td><code>@<b>NgModule</b>({ declarations: ..., imports: ...,<br> exports: ..., providers: ..., bootstrap: ...})<br>class MyModule {}</code></td>\n<td><p>Defines a module that contains components, directives, pipes, and providers.</p>\n<p>定义一个模块，其中可以包含组件、指令、管道和服务提供商。</p>\n</td>\n</tr><tr>\n<td><code><b>declarations:</b> [MyRedComponent, MyBlueComponent, MyDatePipe]</code></td>\n<td><p>List of components, directives, and pipes that belong to this module.</p>\n<p>属于当前模块的组件、指令和管道的列表。</p>\n</td>\n</tr><tr>\n<td><code><b>imports:</b> [BrowserModule, SomeOtherModule]</code></td>\n<td><p>List of modules to import into this module. Everything from the imported modules\nis available to <code>declarations</code> of this module.</p>\n<p>本模块所导入的模块列表</p>\n</td>\n</tr><tr>\n<td><code><b>exports:</b> [MyRedComponent, MyDatePipe]</code></td>\n<td><p>List of components, directives, and pipes visible to modules that import this module.</p>\n<p>那些导入了本模块的模块所能看到的组件、指令和管道的列表</p>\n</td>\n</tr><tr>\n<td><code><b>providers:</b> [MyService, { provide: ... }]</code></td>\n<td><p>List of dependency injection providers visible both to the contents of this module and to importers of this module.</p>\n<p>依赖注入提供商的列表，本模块以及本模块导入的所有模块中的内容都可以看见它们。</p>\n</td>\n</tr><tr>\n<td><code><b>bootstrap:</b> [MyAppComponent]</code></td>\n<td><p>List of components to bootstrap when this module is bootstrapped.</p>\n<p>当本模块启动时，随之启动的组件列表。</p>\n</td>\n</tr>\n</tbody></table>",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/cheatsheet.md"
}, },
@ -4115,8 +4110,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md"
}, },
{ {
"original": "组件样式通常只会作用于组件自身的 HTML 上。", "original": "Use the `/deep/` shadow-piercing descendant combinator to force a style down through the child\ncomponent tree into all the child component views.\nThe `/deep/` combinator works to any depth of nested components, and it applies to both the view\nchildren and content children of the component.",
"translation": "Use the `/deep/` shadow-piercing descendant combinator to force a style down through the child\ncomponent tree into all the child component views.\nThe `/deep/` combinator works to any depth of nested components, and it applies to both the view\nchildren and content children of the component. 我们可以使用`/deep/`选择器，来强制一个样式对各级子组件的视图也生效，它*不但作用于组件的子视图，也会作用于组件的内容*。", "translation": "我们可以使用`/deep/`选择器，来强制一个样式对各级子组件的视图也生效，它*不但作用于组件的子视图，也会作用于组件的内容*。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md"
}, },
{ {
@ -4270,12 +4265,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md"
}, },
{ {
"original": "`Emulated`模式（**默认值**）通过预处理（并改名）CSS 代码来模拟 Shadow DOM 的行为，以达到把 CSS 样式局限在组件视图中的目的。\n 更多信息，见[附录 1](guide/component-styles#inspect-generated-css) 。(译注：只进不出，全局样式能进来，组件样式出不去)", "original": "* `None` means that Angular does no view encapsulation.\n Angular adds the CSS to the global styles.\n The scoping rules, isolations, and protections discussed earlier don't apply.\n This is essentially the same as pasting the component's styles into the HTML.",
"translation": "* `None` means that Angular does no view encapsulation.\n Angular adds the CSS to the global styles.\n The scoping rules, isolations, and protections discussed earlier don't apply.\n This is essentially the same as pasting the component's styles into the HTML.\n `None`意味着 Angular 不使用视图封装。\n Angular 会把 CSS 添加到全局样式中。而不会应用上前面讨论过的那些作用域规则、隔离和保护等。\n 从本质上来说，这跟把组件的样式直接放进 HTML 是一样的。(译注：能进能出。)\nTo set the components encapsulation mode, use the `encapsulation` property in the component metadata:", "translation": "`None`意味着 Angular 不使用视图封装。\n Angular 会把 CSS 添加到全局样式中。而不会应用上前面讨论过的那些作用域规则、隔离和保护等。\n 从本质上来说，这跟把组件的样式直接放进 HTML 是一样的。(译注：能进能出。)",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md"
}, },
{ {
"original": "* `None` means that Angular does no view encapsulation.\n Angular adds the CSS to the global styles.\n The scoping rules, isolations, and protections discussed earlier don't apply.\n This is essentially the same as pasting the component's styles into the HTML.\n `None`意味着 Angular 不使用视图封装。\n Angular 会把 CSS 添加到全局样式中。而不会应用上前面讨论过的那些作用域规则、隔离和保护等。\n 从本质上来说，这跟把组件的样式直接放进 HTML 是一样的。(译注：能进能出。)\nTo set the components encapsulation mode, use the `encapsulation` property in the component metadata:", "original": "To set the components encapsulation mode, use the `encapsulation` property in the component metadata:",
"translation": "通过组件元数据中的`encapsulation`属性来设置组件封装模式：", "translation": "通过组件元数据中的`encapsulation`属性来设置组件封装模式：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/component-styles.md"
}, },
@ -4724,11 +4719,6 @@
"translation": "我们通常在构造函数里面，为参数指定类型，让Angular来处理依赖注入。该参数类型就是依赖注入器所需的*令牌*。\nAngular把该令牌传给注入器，然后把得到的结果赋给参数。下面是一个典型的例子：", "translation": "我们通常在构造函数里面，为参数指定类型，让Angular来处理依赖注入。该参数类型就是依赖注入器所需的*令牌*。\nAngular把该令牌传给注入器，然后把得到的结果赋给参数。下面是一个典型的例子：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
}, },
{
"original": "我们通常在构造函数里面，为参数指定类型，让Angular来处理依赖注入。该参数类型就是依赖注入器所需的*令牌*。\nAngular把该令牌传给注入器，然后把得到的结果赋给参数。下面是一个典型的例子：",
"translation": "<code-example path=\"dependency-injection-in-action/src/app/hero-bios.component.ts\" region=\"ctor\" title=\"src/app/hero-bios.component.ts (组件构造器注入)\" linenums=\"false\">",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
},
{ {
"original": "Angular asks the injector for the service associated with the `LoggerService`\nand assigns the returned value to the `logger` parameter.", "original": "Angular asks the injector for the service associated with the `LoggerService`\nand assigns the returned value to the `logger` parameter.",
"translation": "Angular向注入器请求与`LoggerService`对应的服务，并将返回值赋给`logger`参数。", "translation": "Angular向注入器请求与`LoggerService`对应的服务，并将返回值赋给`logger`参数。",
@ -4749,11 +4739,6 @@
"translation": "新建的注入器中没有提供商。\nAngular会使用一些自带的提供商来初始化这些注入器。我们必须自行注册属于_自己_的提供商，通常用`组件`或者`指令`元数据中的`providers`数组进行注册。", "translation": "新建的注入器中没有提供商。\nAngular会使用一些自带的提供商来初始化这些注入器。我们必须自行注册属于_自己_的提供商，通常用`组件`或者`指令`元数据中的`providers`数组进行注册。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
}, },
{
"original": "新建的注入器中没有提供商。\nAngular会使用一些自带的提供商来初始化这些注入器。我们必须自行注册属于_自己_的提供商，通常用`组件`或者`指令`元数据中的`providers`数组进行注册。",
"translation": "<code-example path=\"dependency-injection-in-action/src/app/app.component.ts\" region=\"providers\" title=\"src/app/app.component.ts (提供商)\">",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
},
{ {
"original": "### Defining providers", "original": "### Defining providers",
"translation": "### 定义提供商", "translation": "### 定义提供商",
@ -4764,11 +4749,6 @@
"translation": "简单的类提供商是最典型的例子。只要在`providers`数值里面提到该类就可以了。", "translation": "简单的类提供商是最典型的例子。只要在`providers`数值里面提到该类就可以了。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
}, },
{
"original": "简单的类提供商是最典型的例子。只要在`providers`数值里面提到该类就可以了。",
"translation": "<code-example path=\"dependency-injection-in-action/src/app/hero-bios.component.ts\" region=\"class-provider\" title=\"src/app/hero-bios.component.ts (类提供商)\" linenums=\"false\">",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
},
{ {
"original": "It's that simple because the most common injected service is an instance of a class.\nBut not every dependency can be satisfied by creating a new instance of a class.\nYou need other ways to deliver dependency values and that means you need other ways to specify a provider.", "original": "It's that simple because the most common injected service is an instance of a class.\nBut not every dependency can be satisfied by creating a new instance of a class.\nYou need other ways to deliver dependency values and that means you need other ways to specify a provider.",
"translation": "注册类提供商之所以这么简单，是因为最常见的可注入服务就是一个类的实例。\n但是，并不是所有的依赖都只要创建一个类的新实例就可以交付了。我们还需要其它的交付方式，这意味着我们也需要其它方式来指定提供商。", "translation": "注册类提供商之所以这么简单，是因为最常见的可注入服务就是一个类的实例。\n但是，并不是所有的依赖都只要创建一个类的新实例就可以交付了。我们还需要其它的交付方式，这意味着我们也需要其它方式来指定提供商。",
@ -5281,12 +5261,7 @@
}, },
{ {
"original": "Imagine one branch of a component hierarchy: *Alice* -> *Barry* -> *Carol*. \nBoth *Alice* and *Barry* implement the `Parent` *class-interface*.", "original": "Imagine one branch of a component hierarchy: *Alice* -> *Barry* -> *Carol*. \nBoth *Alice* and *Barry* implement the `Parent` *class-interface*.",
"translation": "想象组件树中的一个分支为：*Alice* -> *Barry* -> *Carol*。", "translation": "想象组件树中的一个分支为：*Alice* -> *Barry* -> *Carol*。*Alice*和*Barry*都实现了这个`Parent`*类-接口*。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
},
{
"original": "想象组件树中的一个分支为：*Alice* -> *Barry* -> *Carol*。",
"translation": "*Alice*和*Barry*都实现了这个`Parent`*类-接口*。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection-in-action.md"
}, },
{ {
@ -5455,8 +5430,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md"
}, },
{ {
"original": "{@a testing-the-component}", "original": "## Testing the component",
"translation": "## Testing the component\n## 测试组件", "translation": "## 测试组件",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md"
}, },
{ {
@ -5791,7 +5766,7 @@
}, },
{ {
"original": "Register the dependency provider using the `InjectionToken` object:", "original": "Register the dependency provider using the `InjectionToken` object:",
"translation": "使用这个`InjectionToken`对象注册依赖的提供商：<code-example path=\"dependency-injection/src/app/providers.component.ts\" region=\"providers-9\" linenums=\"false\">\n</code-example>", "translation": "使用这个`InjectionToken`对象注册依赖的提供商：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md"
}, },
{ {
@ -5806,12 +5781,12 @@
}, },
{ {
"original": "Alternatively, you can provide and inject the configuration object in an ngModule like `AppModule`.", "original": "Alternatively, you can provide and inject the configuration object in an ngModule like `AppModule`.",
"translation": "或者在 ngModule 中提供并注入这个配置对象，如`AppModule`。<code-example path=\"dependency-injection/src/app/app.module.ts\" region=\"providers\" title=\"src/app/app.module.ts (providers)\"></code-example>", "translation": "或者在 ngModule 中提供并注入这个配置对象，如`AppModule`。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md"
}, },
{ {
"original": "{@a optional}", "original": "## Optional dependencies",
"translation": "## Optional dependencies\n## 可选依赖", "translation": "## 可选依赖",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/dependency-injection.md"
}, },
{ {
@ -6009,11 +5984,6 @@
"translation": "Angular应用默认运行在开发模式下，正如在浏览器控制台中看到的如下信息：", "translation": "Angular应用默认运行在开发模式下，正如在浏览器控制台中看到的如下信息：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/deployment.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/deployment.md"
}, },
{
"original": "Angular应用默认运行在开发模式下，正如在浏览器控制台中看到的如下信息：",
"translation": "<code-example format=\"nocode\">\n Angular is running in the development mode. Call enableProdMode() to enable the production mode.\n （Angular正运行在开发模式下。调用enableProdMode()来启用生产模式）",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/deployment.md"
},
{ {
"original": "Switching to _production mode_ can make it run faster by disabling development specific checks such as the dual change detection cycles.", "original": "Switching to _production mode_ can make it run faster by disabling development specific checks such as the dual change detection cycles.",
"translation": "切换到生产模式可以通过禁用开发环境下特有的检查（比如双重变更检测周期）来让应用运行得更快。", "translation": "切换到生产模式可以通过禁用开发环境下特有的检查（比如双重变更检测周期）来让应用运行得更快。",
@ -6146,7 +6116,7 @@
}, },
{ {
"original": "* [Firebase hosting](https://firebase.google.com/docs/hosting/): add a\n[rewrite rule](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites).", "original": "* [Firebase hosting](https://firebase.google.com/docs/hosting/): add a\n[rewrite rule](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites).",
"translation": "[Firebase主机服务](https://firebase.google.com/docs/hosting/)：添加一条[重写规则](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites)。<code-example format=\".\">\n \"rewrites\": [ {\n \"source\": \"**\",\n \"destination\": \"/index.html\"\n } ]", "translation": "[Firebase主机服务](https://firebase.google.com/docs/hosting/)：添加一条[重写规则](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites)。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/deployment.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/deployment.md"
}, },
{ {
@ -7396,7 +7366,7 @@
}, },
{ {
"original": "You can create a new hero like this:", "original": "You can create a new hero like this:",
"translation": "可以这样创建新英雄：<code-example path=\"forms/src/app/hero-form/hero-form.component.ts \" linenums=\"false\" region=\"SkyDog\">", "translation": "可以这样创建新英雄：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7511,7 +7481,7 @@
}, },
{ {
"original": "Replace the contents of its template with the following:", "original": "Replace the contents of its template with the following:",
"translation": "把“快速上手”的版本内容替换成下列代码：<code-example path=\"forms/src/app/app.component.html\" title=\"src/app/app.component.html\">", "translation": "把“快速上手”的版本内容替换成下列代码：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7591,7 +7561,7 @@
}, },
{ {
"original": "Add the following HTML *immediately below* the *Alter Ego* group:", "original": "Add the following HTML *immediately below* the *Alter Ego* group:",
"translation": "在 *Alter Ego* 的紧下方添加如下 HTML：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (powers)\" region=\"powers\">", "translation": "在 *Alter Ego* 的紧下方添加如下 HTML：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7631,7 +7601,7 @@
}, },
{ {
"original": "Find the `<input>` tag for *Name* and update it like this:", "original": "Find the `<input>` tag for *Name* and update it like this:",
"translation": "找到 *Name* 对应的`<input>`标签，并且像这样修改它：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"ngModelName-1\">", "translation": "找到 *Name* 对应的`<input>`标签，并且像这样修改它：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7646,7 +7616,7 @@
}, },
{ {
"original": "You need one more addition to display the data. Declare\na template variable for the form. Update the `<form>` tag with\n`#heroForm=\"ngForm\"` as follows:", "original": "You need one more addition to display the data. Declare\na template variable for the form. Update the `<form>` tag with\n`#heroForm=\"ngForm\"` as follows:",
"translation": "我们需要更多的工作来显示数据。在表单中声明一个模板变量。往`<form>`标签中加入`#heroForm=\"ngForm\"`，代码如下：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"template-variable\">", "translation": "我们需要更多的工作来显示数据。在表单中声明一个模板变量。往`<form>`标签中加入`#heroForm=\"ngForm\"`，代码如下：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7656,21 +7626,21 @@
}, },
{ {
"original": "### The _NgForm_ directive", "original": "### The _NgForm_ directive",
"translation": "### `NgForm`指令What `NgForm` directive?\nYou didn't add an [NgForm](api/forms/NgForm) directive.", "translation": "### `NgForm`指令",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "### `NgForm`指令What `NgForm` directive?\nYou didn't add an [NgForm](api/forms/NgForm) directive.", "original": "What `NgForm` directive?\nYou didn't add an [NgForm](api/forms/NgForm) directive.",
"translation": "什么是`NgForm`指令？\n但我们明明没有添加过[NgForm](api/forms/NgForm)指令啊！Angular did. Angular automatically creates and attaches an `NgForm` directive to the `<form>` tag.", "translation": "什么是`NgForm`指令？\n但我们明明没有添加过[NgForm](api/forms/NgForm)指令啊！",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "什么是`NgForm`指令？\n但我们明明没有添加过[NgForm](api/forms/NgForm)指令啊！Angular did. Angular automatically creates and attaches an `NgForm` directive to the `<form>` tag.", "original": "Angular did. Angular automatically creates and attaches an `NgForm` directive to the `<form>` tag.",
"translation": "Angular替你做了。Angular会在`<form>`标签上自动创建并附加一个`NgForm`指令。The `NgForm` directive supplements the `form` element with additional features.\nIt holds the controls you created for the elements with an `ngModel` directive\nand `name` attribute, and monitors their properties, including their validity.\nIt also has its own `valid` property which is true only *if every contained\ncontrol* is valid.", "translation": "Angular替你做了。Angular会在`<form>`标签上自动创建并附加一个`NgForm`指令。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "Angular替你做了。Angular会在`<form>`标签上自动创建并附加一个`NgForm`指令。The `NgForm` directive supplements the `form` element with additional features.\nIt holds the controls you created for the elements with an `ngModel` directive\nand `name` attribute, and monitors their properties, including their validity.\nIt also has its own `valid` property which is true only *if every contained\ncontrol* is valid.", "original": "The `NgForm` directive supplements the `form` element with additional features.\nIt holds the controls you created for the elements with an `ngModel` directive\nand `name` attribute, and monitors their properties, including their validity.\nIt also has its own `valid` property which is true only *if every contained\ncontrol* is valid.",
"translation": "`NgForm`指令为`form`增补了一些额外特性。\n它会控制那些带有`ngModel`指令和`name`属性的元素，监听他们的属性（包括其有效性）。\n它还有自己的`valid`属性，这个属性只有在*它包含的每个控件*都有效时才是真。", "translation": "`NgForm`指令为`form`增补了一些额外特性。\n它会控制那些带有`ngModel`指令和`name`属性的元素，监听他们的属性（包括其有效性）。\n它还有自己的`valid`属性，这个属性只有在*它包含的每个控件*都有效时才是真。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
@ -7711,16 +7681,16 @@
}, },
{ {
"original": "After revision, the core of the form should look like this:", "original": "After revision, the core of the form should look like this:",
"translation": "修改之后，这个表单的核心是这样的：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"ngModel-2\">", "translation": "修改之后，这个表单的核心是这样的：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "<div class=\"l-sub-section\">", "original": "* Each input element has an `id` property that is used by the `label` element's `for` attribute\nto match the label to its input control.",
"translation": "* Each input element has an `id` property that is used by the `label` element's `for` attribute\nto match the label to its input control.\n每个 input 元素都有`id`属性，`label`元素的`for`属性用它来匹配到对应的输入控件。* Each input element has a `name` property that is required by Angular forms to register the control with the form.", "translation": "每个 input 元素都有`id`属性，`label`元素的`for`属性用它来匹配到对应的输入控件。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "* Each input element has an `id` property that is used by the `label` element's `for` attribute\nto match the label to its input control.\n每个 input 元素都有`id`属性，`label`元素的`for`属性用它来匹配到对应的输入控件。* Each input element has a `name` property that is required by Angular forms to register the control with the form.", "original": "* Each input element has a `name` property that is required by Angular forms to register the control with the form.",
"translation": "每个 input 元素都有`name`属性，Angular 表单用它注册控件。", "translation": "每个 input 元素都有`name`属性，Angular 表单用它注册控件。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
@ -7786,7 +7756,7 @@
}, },
{ {
"original": "Temporarily add a [template reference variable](guide/template-syntax#ref-vars) named `spy`\nto the _Name_ `<input>` tag and use it to display the input's CSS classes.", "original": "Temporarily add a [template reference variable](guide/template-syntax#ref-vars) named `spy`\nto the _Name_ `<input>` tag and use it to display the input's CSS classes.",
"translation": "往姓名`<input>`标签上添加名叫 **spy** 的临时[模板引用变量](guide/template-syntax#ref-vars)，\n然后用这个 spy 来显示它上面的所有 CSS 类。<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"ngModelName-2\">", "translation": "往姓名`<input>`标签上添加名叫 **spy** 的临时[模板引用变量](guide/template-syntax#ref-vars)，\n然后用这个 spy 来显示它上面的所有 CSS 类。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7901,7 +7871,7 @@
}, },
{ {
"original": "Here's an example of an error message added to the _name_ input box:", "original": "Here's an example of an error message added to the _name_ input box:",
"translation": "这个例子中我们把一条错误信息添加到了_name_输入框中：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"name-with-error-msg\">", "translation": "这个例子中我们把一条错误信息添加到了_name_输入框中：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7916,7 +7886,7 @@
}, },
{ {
"original": "You control visibility of the name error message by binding properties of the `name`\ncontrol to the message `<div>` element's `hidden` property.", "original": "You control visibility of the name error message by binding properties of the `name`\ncontrol to the message `<div>` element's `hidden` property.",
"translation": "我们把`div`元素的`hidden`属性绑定到`name`控件的属性，这样就可以控制“姓名”字段错误信息的可见性了。<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (hidden-error-msg)\" region=\"hidden-error-msg\">", "translation": "我们把`div`元素的`hidden`属性绑定到`name`控件的属性，这样就可以控制“姓名”字段错误信息的可见性了。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7946,7 +7916,7 @@
}, },
{ {
"original": "Now you'll add a new hero in this form.\nPlace a *New Hero* button at the bottom of the form and bind its click event to a `newHero` component method.", "original": "Now you'll add a new hero in this form.\nPlace a *New Hero* button at the bottom of the form and bind its click event to a `newHero` component method.",
"translation": "我们希望在这个表单中添加新的英雄。\n 在表单的底部放置“New Hero（新增英雄）”按钮，并把它的点击事件绑定到`newHero`组件。<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" region=\"new-hero-button-no-reset\" title=\"src/app/hero-form/hero-form.component.html (New Hero button)\">", "translation": "我们希望在这个表单中添加新的英雄。\n 在表单的底部放置“New Hero（新增英雄）”按钮，并把它的点击事件绑定到`newHero`组件。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7966,7 +7936,7 @@
}, },
{ {
"original": "You have to clear all of the flags imperatively, which you can do\nby calling the form's `reset()` method after calling the `newHero()` method.", "original": "You have to clear all of the flags imperatively, which you can do\nby calling the form's `reset()` method after calling the `newHero()` method.",
"translation": "我们必须清除所有标记，在调用`newHero()`方法后调用表单的`reset()`方法即可。<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" region=\"new-hero-button-form-reset\" title=\"src/app/hero-form/hero-form.component.html (Reset the form)\">", "translation": "我们必须清除所有标记，在调用`newHero()`方法后调用表单的`reset()`方法即可。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7986,7 +7956,7 @@
}, },
{ {
"original": "A \"form submit\" is useless at the moment.\nTo make it useful, bind the form's `ngSubmit` event property\nto the hero form component's `onSubmit()` method:", "original": "A \"form submit\" is useless at the moment.\nTo make it useful, bind the form's `ngSubmit` event property\nto the hero form component's `onSubmit()` method:",
"translation": "现在这样仅仅触发“表单提交”是没用的。\n要让它有用，就要把该表单的`ngSubmit`事件属性绑定到英雄表单组件的`onSubmit()`方法上：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (ngSubmit)\" region=\"ngSubmit\">", "translation": "现在这样仅仅触发“表单提交”是没用的。\n要让它有用，就要把该表单的`ngSubmit`事件属性绑定到英雄表单组件的`onSubmit()`方法上：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -7996,7 +7966,7 @@
}, },
{ {
"original": "You'll bind the form's overall validity via\nthe `heroForm` variable to the button's `disabled` property\nusing an event binding. Here's the code:", "original": "You'll bind the form's overall validity via\nthe `heroForm` variable to the button's `disabled` property\nusing an event binding. Here's the code:",
"translation": "我们要把表单的总体有效性通过`heroForm`变量绑定到此按钮的`disabled`属性上，代码如下：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (submit-button)\" region=\"submit-button\">", "translation": "我们要把表单的总体有效性通过`heroForm`变量绑定到此按钮的`disabled`属性上，代码如下：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -8051,12 +8021,12 @@
}, },
{ {
"original": "Wrap the form in a `<div>` and bind\nits `hidden` property to the `HeroFormComponent.submitted` property.", "original": "Wrap the form in a `<div>` and bind\nits `hidden` property to the `HeroFormComponent.submitted` property.",
"translation": "先把表单包裹进`<div>`中，再把它的`hidden`属性绑定到`HeroFormComponent.submitted`属性。<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"edit-div\">", "translation": "先把表单包裹进`<div>`中，再把它的`hidden`属性绑定到`HeroFormComponent.submitted`属性。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
"original": "The main form is visible from the start because the\n`submitted` property is false until you submit the form,\nas this fragment from the `HeroFormComponent` shows:", "original": "The main form is visible from the start because the\n`submitted` property is false until you submit the form,\nas this fragment from the `HeroFormComponent` shows:",
"translation": "主表单从一开始就是可见的，因为`submitted`属性是 false，直到提交了这个表单。\n来自`HeroFormComponent`的代码片段告诉了我们这一点：<code-example path=\"forms/src/app/hero-form/hero-form.component.ts\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.ts (submitted)\" region=\"submitted\">", "translation": "主表单从一开始就是可见的，因为`submitted`属性是 false，直到提交了这个表单。\n来自`HeroFormComponent`的代码片段告诉了我们这一点：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -8066,7 +8036,7 @@
}, },
{ {
"original": "Now the app needs to show something else while the form is in the submitted state.\nAdd the following HTML below the `<div>` wrapper you just wrote:", "original": "Now the app needs to show something else while the form is in the submitted state.\nAdd the following HTML below the `<div>` wrapper you just wrote:",
"translation": "现在，当表单处于已提交状态时，需要显示一些别的东西。\n在刚刚写的`<div>`包装下方，添加下列 HTML 语句：<code-example path=\"forms/src/app/hero-form/hero-form.component.html\" linenums=\"false\" title=\"src/app/hero-form/hero-form.component.html (excerpt)\" region=\"submitted\">", "translation": "现在，当表单处于已提交状态时，需要显示一些别的东西。\n在刚刚写的`<div>`包装下方，添加下列 HTML 语句：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/forms.md"
}, },
{ {
@ -9514,11 +9484,6 @@
"translation": "*注意这个`subscribe()`方法*。 所有从`HttpClient`返回的可观察对象都是*冷的（cold）*，也就是说，它们只是发起请求的*蓝图*而已。在我们调用`subscribe()`之前，什么都不会发生，而当我们每次调用`subscribe()`时，就会独立发起一次请求。\n比如，下列代码会使用同样的数据发送两次同样的 POST 请求：", "translation": "*注意这个`subscribe()`方法*。 所有从`HttpClient`返回的可观察对象都是*冷的（cold）*，也就是说，它们只是发起请求的*蓝图*而已。在我们调用`subscribe()`之前，什么都不会发生，而当我们每次调用`subscribe()`时，就会独立发起一次请求。\n比如，下列代码会使用同样的数据发送两次同样的 POST 请求：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/http.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/http.md"
}, },
{
"original": "<code-example \n path=\"http/src/app/heroes/heroes.service.ts\"\n region=\"update-headers\" linenums=\"false\">\n</code-example>",
"translation": "`HttpHeaders`类是不可变对象（immutable），所以每个`set()`都会返回一个新实例，并且应用上这些修改。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/http.md"
},
{ {
"original": "#### URL Parameters", "original": "#### URL Parameters",
"translation": "#### URL 参数", "translation": "#### URL 参数",
@ -11036,11 +11001,11 @@
}, },
{ {
"original": "* A component could be imported from another app module (so you can't declare it) and re-exported by this module.", "original": "* A component could be imported from another app module (so you can't declare it) and re-exported by this module.",
"translation": "`HeroComponent`可能是从另一个应用模块中导入的（所以我们没法声明它）并且被当前模块重新导出。\n* A component could be exported for inclusion in an external component's template\nas well as dynamically loaded in a pop-up dialog.", "translation": "`HeroComponent`可能是从另一个应用模块中导入的（所以我们没法声明它）并且被当前模块重新导出。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ngmodule-faq.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ngmodule-faq.md"
}, },
{ {
"original": "`HeroComponent`可能是从另一个应用模块中导入的（所以我们没法声明它）并且被当前模块重新导出。\n* A component could be exported for inclusion in an external component's template\nas well as dynamically loaded in a pop-up dialog.", "original": "* A component could be exported for inclusion in an external component's template\nas well as dynamically loaded in a pop-up dialog.",
"translation": "`HeroComponent`可能被导入，以便用在外部组件的模板中，但也可能同时被一个弹出式对话框加载。", "translation": "`HeroComponent`可能被导入，以便用在外部组件的模板中，但也可能同时被一个弹出式对话框加载。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ngmodule-faq.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/ngmodule-faq.md"
}, },
@ -12144,11 +12109,6 @@
"translation": "在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到\n右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。", "translation": "在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到\n右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md"
}, },
{
"original": "在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到\n右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。",
"translation": "在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到\n右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md"
},
{ {
"original": "## Built-in pipes", "original": "## Built-in pipes",
"translation": "## 内置的管道", "translation": "## 内置的管道",
@ -12210,8 +12170,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md"
}, },
{ {
"original": "</div>", "original": "## Chaining pipes",
"translation": "## Chaining pipes\n## 链式管道", "translation": "## 链式管道",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/pipes.md"
}, },
{ {
@ -15985,8 +15945,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
{ {
"original": "{@a optional-route-parameters}", "original": "### Route Parameters: Required or optional?",
"translation": "### Route Parameters: Required or optional?\n### 路由参数：必须还是可选？", "translation": "### 路由参数：必须还是可选？",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
{ {
@ -16361,11 +16321,16 @@
}, },
{ {
"original": "This section shows you how to organize the crisis center\nto conform to the following recommended pattern for Angular applications:", "original": "This section shows you how to organize the crisis center\nto conform to the following recommended pattern for Angular applications:",
"translation": "本节会展示如何组织危机中心，来满足Angular应用所推荐的模式：* Each feature area resides in its own folder. 把每个特性放在自己的目录中。\n* Each feature has its own Angular feature module.", "translation": "本节会展示如何组织危机中心，来满足Angular应用所推荐的模式：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
{ {
"original": "本节会展示如何组织危机中心，来满足Angular应用所推荐的模式：* Each feature area resides in its own folder. 把每个特性放在自己的目录中。\n* Each feature has its own Angular feature module.", "original": "* Each feature area resides in its own folder.",
"translation": "把每个特性放在自己的目录中。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
},
{
"original": "* Each feature has its own Angular feature module.",
"translation": "每个特性都有自己的Angular特性模块。", "translation": "每个特性都有自己的Angular特性模块。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
@ -16665,12 +16630,17 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
{ {
"original": "第二路由很像主路由，配置方式也一样。它们只有一些关键的不同点：", "original": "* They are independent of each other.",
"translation": "* They are independent of each other.\n它们彼此互不依赖。* They work in combination with other routes. 它们与其它路由组合使用。\n* They are displayed in named outlets.", "translation": "它们彼此互不依赖。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
{ {
"original": "* They are independent of each other.\n它们彼此互不依赖。* They work in combination with other routes. 它们与其它路由组合使用。\n* They are displayed in named outlets.", "original": "* They work in combination with other routes.",
"translation": "它们与其它路由组合使用。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
},
{
"original": "* They are displayed in named outlets.",
"translation": "它们显示在命名出口中。", "translation": "它们显示在命名出口中。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/router.md"
}, },
@ -18280,8 +18250,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/security.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/security.md"
}, },
{ {
"original": "为了防范XSS攻击，我们必须阻止恶意代码进入DOM。比如，如果某个攻击者能骗我们把`<script>`标签插入到DOM，就可以在我们的网站上运行任何代码。\n除了`<script>`，攻击者还可以使用很多DOM元素和属性来执行代码，比如`<img onerror=\"...\">`、`<a href=\"javascript:...\">`。\n如果攻击者所控制的数据混进了DOM，就会导致安全漏洞。", "original": "### Angular’s cross-site scripting security model",
"translation": "### Angular’s cross-site scripting security model\n### Angular的“跨站脚本安全模型”", "translation": "### Angular的“跨站脚本安全模型”",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/security.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/security.md"
}, },
{ {
@ -18831,11 +18801,11 @@
}, },
{ {
"original": "## Download", "original": "## Download",
"translation": "## 下载\n<a href=\"https://github.com/angular/quickstart/archive/master.zip\" title=\"Download the QuickStart seed repository\">Download the QuickStart seed</a>\nand unzip it into your project folder. Then perform the remaining steps with these terminal commands.", "translation": "## 下载",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/setup.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/setup.md"
}, },
{ {
"original": "## 下载\n<a href=\"https://github.com/angular/quickstart/archive/master.zip\" title=\"Download the QuickStart seed repository\">Download the QuickStart seed</a>\nand unzip it into your project folder. Then perform the remaining steps with these terminal commands.", "original": "<a href=\"https://github.com/angular/quickstart/archive/master.zip\" title=\"Download the QuickStart seed repository\">Download the QuickStart seed</a>\nand unzip it into your project folder. Then perform the remaining steps with these terminal commands.",
"translation": "<a href=\"https://github.com/angular/quickstart/archive/master.zip\" title=\"下载《快速上手》种子库\">下载《快速上手》种子</a>\n并解压到你的项目目录中。然后执行下面的命令完成剩余步骤。", "translation": "<a href=\"https://github.com/angular/quickstart/archive/master.zip\" title=\"下载《快速上手》种子库\">下载《快速上手》种子</a>\n并解压到你的项目目录中。然后执行下面的命令完成剩余步骤。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/setup.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/setup.md"
}, },
@ -21034,11 +21004,6 @@
"translation": "#### 风格 04-09", "translation": "#### 风格 04-09",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md"
}, },
{
"original": "#### 风格 04-09",
"translation": "#### 风格 04-09",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md"
},
{ {
"original": "**Do** create an NgModule for all distinct features in an application;\nfor example, a `Heroes` feature.", "original": "**Do** create an NgModule for all distinct features in an application;\nfor example, a `Heroes` feature.",
"translation": "**坚持**为应用中每个明显的特性创建一个 Angular 模块。", "translation": "**坚持**为应用中每个明显的特性创建一个 Angular 模块。",
@ -21685,8 +21650,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md"
}, },
{ {
"original": "<a href=\"#toc\" class='to-top'>回到顶部</a>", "original": "## Directives",
"translation": "## Directives\n## 指令", "translation": "## 指令",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/styleguide.md"
}, },
{ {
@ -22540,17 +22505,17 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{ {
"original": "<div class=\"alert is-important\">", "original": "<!-- placeholder -->",
"translation": "译注：由于 HTML attribute 和 DOM property 在中文中都被翻译成了“属性”，无法区分，\n而接下来的部分重点是对它们进行比较。", "translation": "译注：由于 HTML attribute 和 DOM property 在中文中都被翻译成了“属性”，无法区分，\n而接下来的部分重点是对它们进行比较。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{ {
"original": "译注：由于 HTML attribute 和 DOM property 在中文中都被翻译成了“属性”，无法区分，\n而接下来的部分重点是对它们进行比较。", "original": "<!-- placeholder -->",
"translation": "我们无法改变历史，因此，在本章的翻译中，保留了它们的英文形式，不加翻译，以免混淆。\n本章中，如果提到“属性”的地方，一定是指 property，因为在 Angular 中，实际上很少涉及 attribute。", "translation": "我们无法改变历史，因此，在本章的翻译中，保留了它们的英文形式，不加翻译，以免混淆。\n本章中，如果提到“属性”的地方，一定是指 property，因为在 Angular 中，实际上很少涉及 attribute。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{ {
"original": "我们无法改变历史，因此，在本章的翻译中，保留了它们的英文形式，不加翻译，以免混淆。\n本章中，如果提到“属性”的地方，一定是指 property，因为在 Angular 中，实际上很少涉及 attribute。", "original": "<!-- placeholder -->",
"translation": "但在其它章节中，为简单起见，凡是能通过上下文明显区分开的，就仍统一译为“属性”，\n区分不明显的，会加注英文。", "translation": "但在其它章节中，为简单起见，凡是能通过上下文明显区分开的，就仍统一译为“属性”，\n区分不明显的，会加注英文。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
@ -23089,11 +23054,6 @@
"translation": "会得到这个错误：", "translation": "会得到这个错误：",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{
"original": "会得到这个错误：",
"translation": "<code-example format=\"nocode\">\n Template parse errors:\n Can't bind to 'colspan' since it isn't a known native property\n （模板解析错误：不能绑定到 'colspan'，因为它不是已知的原生属性）",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
},
{ {
"original": "As the message says, the `<td>` element does not have a `colspan` property.\nIt has the \"colspan\" *attribute*, but\ninterpolation and property binding can set only *properties*, not attributes.", "original": "As the message says, the `<td>` element does not have a `colspan` property.\nIt has the \"colspan\" *attribute*, but\ninterpolation and property binding can set only *properties*, not attributes.",
"translation": "正如提示中所说，`<td>`元素没有`colspan`属性。\n 但是插值表达式和属性绑定只能设置*属性*，不能设置 attribute。", "translation": "正如提示中所说，`<td>`元素没有`colspan`属性。\n 但是插值表达式和属性绑定只能设置*属性*，不能设置 attribute。",
@ -23190,8 +23150,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{ {
"original": "{@a event-binding}", "original": "## Event binding ( <span class=\"syntax\">(event)</span> )",
"translation": "## Event binding ( <span class=\"syntax\">(event)</span> )\n## 事件绑定 ( <span class=\"syntax\">(事件名)</span> )", "translation": "## 事件绑定 ( <span class=\"syntax\">(事件名)</span> )",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/template-syntax.md"
}, },
{ {
@ -25210,8 +25170,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
"original": "</div>", "original": "### Transcluding Angular Content into AngularJS Component Directives",
"translation": "### Transcluding Angular Content into AngularJS Component Directives\n### 把Angular的内容透传进AngularJS的组件型指令", "translation": "### 把Angular的内容透传进AngularJS的组件型指令",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
@ -25230,8 +25190,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
"original": "<code-example path=\"upgrade-module/src/app/a-to-ajs-transclusion/container.component.ts\" title=\"container.component.ts\">\n</code-example>", "original": "### Making AngularJS Dependencies Injectable to Angular",
"translation": "### Making AngularJS Dependencies Injectable to Angular\n### 让AngularJS中的依赖可被注入到Angular", "translation": "### 让AngularJS中的依赖可被注入到Angular",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
@ -25500,8 +25460,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
"original": "如果项目中有任何AngularJS的服务，它们也是转换成类的优秀候选人，像控制器一样，它们也是构造函数。\n但是在本项目中，我们只有一个`Phone`工厂，这有点特别，因为它是一个`ngResource`工厂。\n所以我们不会在准备阶段中处理它，而是在下一节中直接把它转换成Angular服务。", "original": "### Installing Angular",
"translation": "### Installing Angular\n### 安装Angular", "translation": "### 安装Angular",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
@ -25970,12 +25930,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
"original": "<code-example path=\"upgrade-phonecat-3-final/index.html\" region=\"appcomponent\" title=\"index.html (body)\" linenums=\"false\">\n</code-example>", "original": "#### Create the _Routing Module_",
"translation": "#### Create the _Routing Module_\n#### 创建*路由模块*\nA router needs configuration whether it's the AngularJS or Angular or any other router.", "translation": "#### 创建*路由模块*",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
{ {
"original": "#### Create the _Routing Module_\n#### 创建*路由模块*\nA router needs configuration whether it's the AngularJS or Angular or any other router.", "original": "A router needs configuration whether it's the AngularJS or Angular or any other router.",
"translation": "无论在AngularJS还是Angular或其它框架中，路由器都需要进行配置。", "translation": "无论在AngularJS还是Angular或其它框架中，路由器都需要进行配置。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/upgrade.md"
}, },
@ -26270,8 +26230,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
"original": "运行<live-example></live-example>", "original": "## Binding to user input events",
"translation": "## Binding to user input events\n## 绑定到用户输入事件", "translation": "## 绑定到用户输入事件",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
@ -26305,8 +26265,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
"original": "当用户点击按钮时，Angular 调用`ClickMeComponent`的`onClickMe`方法。", "original": "## Get user input from the $event object",
"translation": "## Get user input from the $event object\n## 通过 $event 对象取得用户输入", "translation": "## 通过 $event 对象取得用户输入",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
@ -26324,11 +26284,6 @@
"translation": "当用户按下并释放一个按键时，触发`keyup`事件，Angular 在`$event`变量提供一个相应的 DOM\n事件对象，上面的代码将它作为参数传递给`onKey()`方法。", "translation": "当用户按下并释放一个按键时，触发`keyup`事件，Angular 在`$event`变量提供一个相应的 DOM\n事件对象，上面的代码将它作为参数传递给`onKey()`方法。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{
"original": "当用户按下并释放一个按键时，触发`keyup`事件，Angular 在`$event`变量提供一个相应的 DOM\n事件对象，上面的代码将它作为参数传递给`onKey()`方法。",
"translation": "<code-example path=\"user-input/src/app/keyup.components.ts\" region=\"key-up-component-1-class-no-type\" title=\"src/app/keyup.components.ts (类 v.1)\" linenums=\"false\">",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
},
{ {
"original": "The properties of an `$event` object vary depending on the type of DOM event. For example,\na mouse event includes different information than a input box editing event.", "original": "The properties of an `$event` object vary depending on the type of DOM event. For example,\na mouse event includes different information than a input box editing event.",
"translation": "`$event`对象的属性取决于 DOM 事件的类型。例如，鼠标事件与输入框编辑事件包含了不同的信息。", "translation": "`$event`对象的属性取决于 DOM 事件的类型。例如，鼠标事件与输入框编辑事件包含了不同的信息。",
@ -26485,8 +26440,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
"original": "</code-example>", "original": "## Put it all together",
"translation": "## Put it all together\n## 把它们放在一起", "translation": "## 把它们放在一起",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
@ -26510,8 +26465,8 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
"original": "</code-example>", "original": "### Observations",
"translation": "### Observations\n### 小结", "translation": "### 小结",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/user-input.md"
}, },
{ {
@ -27005,12 +26960,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md"
}, },
{ {
"original": "[生产环境配置](guide/webpack#production-configuration)", "original": "* [Test configuration](guide/webpack#test-configuration)",
"translation": "* [Test configuration](guide/webpack#test-configuration)\n [测试环境配置](guide/webpack#test-configuration)\n* [Trying it out](guide/webpack#try)", "translation": "[测试环境配置](guide/webpack#test-configuration)",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md"
}, },
{ {
"original": "* [Test configuration](guide/webpack#test-configuration)\n [测试环境配置](guide/webpack#test-configuration)\n* [Trying it out](guide/webpack#try)", "original": "* [Trying it out](guide/webpack#try)",
"translation": "[试一下](guide/webpack#try)", "translation": "[试一下](guide/webpack#try)",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md"
}, },
@ -27251,11 +27206,11 @@
}, },
{ {
"original": "* [`resolve`](guide/webpack#common-resolves)&mdash;how to resolve file names when they lack extensions.", "original": "* [`resolve`](guide/webpack#common-resolves)&mdash;how to resolve file names when they lack extensions.",
"translation": "[`resolve`](guide/webpack#common-resolves) - 省略扩展名时如何解释文件名。\n* [`module.rules`](guide/webpack#common-rules)&mdash; `module` is an object with `rules` for deciding how files are loaded.", "translation": "[`resolve`](guide/webpack#common-resolves) - 省略扩展名时如何解释文件名。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md"
}, },
{ {
"original": "[`resolve`](guide/webpack#common-resolves) - 省略扩展名时如何解释文件名。\n* [`module.rules`](guide/webpack#common-rules)&mdash; `module` is an object with `rules` for deciding how files are loaded.", "original": "* [`module.rules`](guide/webpack#common-rules)&mdash; `module` is an object with `rules` for deciding how files are loaded.",
"translation": "[`module.rules`](guide/webpack#common-rules) - `module`是一个对象，里面的`rules`属性用来决定文件如何加载。", "translation": "[`module.rules`](guide/webpack#common-rules) - `module`是一个对象，里面的`rules`属性用来决定文件如何加载。",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/guide/webpack.md"
}, },
@ -27630,12 +27585,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md"
}, },
{ {
"original": "Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身，为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。", "original": "<div class=\"card-container\">",
"translation": "<div class=\"card-container\">\n <a href=\"generated/live-examples/toh-pt1/stackblitz.html\" target=\"_blank\" class=\"docs-card\"\n title=\"通过线上编程环境体验 Angular\">\n <section>Angular 走马观花</section>\n <p>快速体验 Angular 的 \"hello world\" 应用。</p>\n <p class=\"card-footer\">体验 Angular</p>\n </a>", "translation": "<a href=\"generated/live-examples/toh-pt1/stackblitz.html\" target=\"_blank\" class=\"docs-card\"\n title=\"通过线上编程环境体验 Angular\">\n <section>Angular 走马观花</section>\n <p>快速体验 Angular 的 \"hello world\" 应用。</p>\n <p class=\"card-footer\">体验 Angular</p>\n </a>",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md"
}, },
{ {
"original": "<div class=\"card-container\">\n <a href=\"generated/live-examples/toh-pt1/stackblitz.html\" target=\"_blank\" class=\"docs-card\"\n title=\"通过线上编程环境体验 Angular\">\n <section>Angular 走马观花</section>\n <p>快速体验 Angular 的 \"hello world\" 应用。</p>\n <p class=\"card-footer\">体验 Angular</p>\n </a>", "original": "<a href=\"generated/live-examples/toh-pt1/stackblitz.html\" target=\"_blank\" class=\"docs-card\"\n title=\"通过线上编程环境体验 Angular\">\n <section>Angular 走马观花</section>\n <p>快速体验 Angular 的 \"hello world\" 应用。</p>\n <p class=\"card-footer\">体验 Angular</p>\n </a>",
"translation": "<a href=\"guide/quickstart\" class=\"docs-card\" title=\"Angular 快速上手\">\n <section>开始使用 Angular</section>\n <p>跟随\"快速上手\"构建你的开发环境</p>\n <p class=\"card-footer\">快速上手</p>\n </a>", "translation": "<a href=\"guide/quickstart\" class=\"docs-card\" title=\"Angular 快速上手\">\n <section>开始使用 Angular</section>\n <p>跟随\"快速上手\"构建你的开发环境</p>\n <p class=\"card-footer\">快速上手</p>\n </a>",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/marketing/docs.md"
}, },
@ -27945,7 +27900,12 @@
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/translations/cn/home.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/translations/cn/home.md"
}, },
{ {
"original": "# Angular News\n# Angular 新闻中心", "original": "# Angular News",
"translation": "# Angular 新闻中心",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/translations/cn/news.md"
},
{
"original": "# Angular 新闻中心",
"translation": "## Angular 组件库 NG-ZORRO 发布！", "translation": "## Angular 组件库 NG-ZORRO 发布！",
"sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/translations/cn/news.md" "sourceFile": "/Users/twer/private/GDE/angular-cn/aio/content/translations/cn/news.md"
}, },

5
aio/content/dict/dict-entry.ts Normal file
View File

@ -0,0 +1,5 @@
export class DictEntry {
original: string;
translation: string;
sourceFile: string;
}

4
aio/content/dict/extractor.spec.ts
View File

@ -39,12 +39,14 @@ describe('gather to dictionary', () => {
it('should list files recursive', function () { it('should list files recursive', function () {
expect(listMarkdownFiles(__dirname + '/../').length).greaterThan(10); expect(listMarkdownFiles(__dirname + '/../').length).greaterThan(10);
}); });
it('should gather from directory', () => { it('should gather from directory', () => {
const entries = gatherFromMarkdownFiles(__dirname + '/../'); const entries = gatherFromMarkdownFiles(__dirname + '/../');
const dict = JSON.stringify(entries, null, 2); const dict = JSON.stringify(entries, null, 2);
const fs = require('fs'); const fs = require('fs');
fs.writeFileSync(__dirname + '/../dict/dict-2.json', dict, 'utf-8'); fs.writeFileSync(__dirname + '/../dict/dict-3.json', dict, 'utf-8');
expect(entries.length).greaterThan(100); expect(entries.length).greaterThan(100);
}); });
}); });

7
aio/content/dict/extractor.ts
View File

@ -1,4 +1,5 @@
import * as globby from 'globby'; import * as globby from 'globby';
import { DictEntry } from './dict-entry';
export function splitAndTrim(text = ''): string[] { export function splitAndTrim(text = ''): string[] {
return text.split(/\n+\s*\n+/).map(line => line.trim()).filter(line => !!line); return text.split(/\n+\s*\n+/).map(line => line.trim()).filter(line => !!line);
@ -9,12 +10,6 @@ export function isTranslation(text) {
/[\u2E80-\u2EFF\u2F00-\u2FDF\u3000-\u303F\u31C0-\u31EF\u3200-\u32FF\u3300-\u33FF\u3400-\u4DBF\u4DC0-\u4DFF\u4E00-\u9FBF\uF900-\uFAFF\uFE30-\uFE4F\uFF00-\uFFEF]/.test(text); /[\u2E80-\u2EFF\u2F00-\u2FDF\u3000-\u303F\u31C0-\u31EF\u3200-\u32FF\u3300-\u33FF\u3400-\u4DBF\u4DC0-\u4DFF\u4E00-\u9FBF\uF900-\uFAFF\uFE30-\uFE4F\uFF00-\uFFEF]/.test(text);
} }
export class DictEntry {
original: string;
translation: string;
sourceFile: string;
}
export function gatherTranslations(text: string): DictEntry[] { export function gatherTranslations(text: string): DictEntry[] {
const lines = splitAndTrim(text); const lines = splitAndTrim(text);

9
aio/content/dict/translate.spec.ts Normal file
View File

@ -0,0 +1,9 @@
import { expect } from 'chai';
import { lookup } from './translate';
describe('translate with dict', () => {
it('translate original english', () => {
expect(lookup('# Forms')[0].translation).eql('# 表单');
});
});

11
aio/content/dict/translate.ts Normal file
View File

@ -0,0 +1,11 @@
import * as _ from 'lodash';
import { DictEntry } from './dict-entry';
const dict1 = require('./dict-1.json') as DictEntry[];
const dict2 = require('./dict-2.json') as DictEntry[];
const dict3 = require('./dict-3.json') as DictEntry[];
const dict = dict1.concat(dict2).concat(dict3);
export function lookup(english: string, filename: RegExp = /.*/): DictEntry[] {
return _.uniqBy(dict.filter(entry => filename.test(entry.sourceFile)).filter(entry => entry.original === english), 'translation');
}

9
aio/content/guide/ajs-quick-reference.md
View File

@ -529,6 +529,7 @@ AngularJS 为模板提供了七十多个内置指令。
In AngularJS, the `ng-href` is often used to activate a route as part of navigation. In AngularJS, the `ng-href` is often used to activate a route as part of navigation.
在AngularJS 中，`ng-href`通常用来作为导航的一部分，激活一个路由。 在AngularJS 中，`ng-href`通常用来作为导航的一部分，激活一个路由。
<code-example hideCopy format=""> <code-example hideCopy format="">
&lt;a ng-href="#{{ moviesHash }}">Movies&lt;/a> &lt;a ng-href="#{{ moviesHash }}">Movies&lt;/a>
</code-example> </code-example>
@ -1100,7 +1101,9 @@ AngularJS中的很多内置过滤器在Angular中都有对应的管道。
### none ### none
### 没了 ### 没了
For performance reasons, no comparable pipe exists in Angular. Do all your filtering in the component. If you need the same filtering code in several templates, consider building a custom pipe. For performance reasons, no comparable pipe exists in Angular. Do all your filtering in the component. If you need the same filtering code in several templates, consider building a custom pipe.
在Angular中，出于性能的考虑，并没有一个类似的管道。 在Angular中，出于性能的考虑，并没有一个类似的管道。
@ -1279,7 +1282,9 @@ AngularJS中的很多内置过滤器在Angular中都有对应的管道。
### none ### none
### 没了 ### 没了
For performance reasons, no comparable pipe exists in Angular. For performance reasons, no comparable pipe exists in Angular.
Instead, use component code to order or sort results. If you need the same ordering or sorting code in several templates, consider building a custom pipe. Instead, use component code to order or sort results. If you need the same ordering or sorting code in several templates, consider building a custom pipe.
@ -1437,7 +1442,9 @@ The Angular code is shown using TypeScript.
### Controller registration ### Controller registration
### 控制器注册 <code-example hideCopy> ### 控制器注册
<code-example hideCopy>
angular angular
.module("movieHunter") .module("movieHunter")
.controller("MovieListCtrl", .controller("MovieListCtrl",

2
aio/content/guide/animations.md
View File

@ -11,6 +11,7 @@ more fun but also easier to use.
设计良好的动画不但会让UI更有趣，还会让它更容易使用。 设计良好的动画不但会让UI更有趣，还会让它更容易使用。
## Overview ## Overview
## 概述 ## 概述
Angular's animation system lets you build animations that run with the same kind of native Angular's animation system lets you build animations that run with the same kind of native
@ -574,6 +575,7 @@ One group animates the element transform and width; the other group animates the
## Animation callbacks ## Animation callbacks
## 动画回调 ## 动画回调
A callback is fired when an animation is started and also when it is done. A callback is fired when an animation is started and also when it is done.

3
aio/content/guide/aot-compiler.md
View File

@ -47,9 +47,6 @@ For AOT compilation, append the `--aot` flags to the _build-only_ or the _build-
ng serve --aot ng serve --aot
</code-example> </code-example>
Angular应用主要包含组件和它们的HTML模板。
在浏览器可以渲染应用之前，组件和模板必须要被**Angular编译器**转换为可以执行的JavaScript。
<div class="l-sub-section"> <div class="l-sub-section">
The `--prod` meta-flag compiles with AOT by default. The `--prod` meta-flag compiles with AOT by default.

1
aio/content/guide/architecture.md
View File

@ -207,6 +207,7 @@ Each Angular library name begins with the `@angular` prefix.
每个 Angular 库的名字都带有`@angular`前缀。 每个 Angular 库的名字都带有`@angular`前缀。
You install them with the **npm** package manager and import parts of them with JavaScript `import` statements. You install them with the **npm** package manager and import parts of them with JavaScript `import` statements.
用 **npm** 包管理工具安装它们，用 JavaScript 的`import`语句导入其中某些部件。<br class="clear"> 用 **npm** 包管理工具安装它们，用 JavaScript 的`import`语句导入其中某些部件。<br class="clear">
For example, import Angular's `Component` decorator from the `@angular/core` library like this: For example, import Angular's `Component` decorator from the `@angular/core` library like this:

7
aio/content/guide/attribute-directives.md
View File

@ -183,7 +183,9 @@ This first implementation sets the background color of the host element to yello
To use the new `HighlightDirective`, add a paragraph (`<p>`) element to the template of the root `AppComponent` and apply the directive as an attribute. To use the new `HighlightDirective`, add a paragraph (`<p>`) element to the template of the root `AppComponent` and apply the directive as an attribute.
运行应用，就会看到我们的指令确实高亮了段落中的文本。<code-example path="attribute-directives/src/app/app.component.1.html" title="src/app/app.component.html" region="applied"></code-example> 运行应用，就会看到我们的指令确实高亮了段落中的文本。
<code-example path="attribute-directives/src/app/app.component.1.html" title="src/app/app.component.html" region="applied"></code-example>
Now run the application to see the `HighlightDirective` in action. Now run the application to see the `HighlightDirective` in action.
@ -312,10 +314,11 @@ In this section, you give the developer the power to set the highlight color whi
我们应该让指令的使用者可以指定要用哪种颜色进行高亮。 我们应该让指令的使用者可以指定要用哪种颜色进行高亮。
Begin by adding `Input` to the list of symbols imported from `@angular/core`. Begin by adding `Input` to the list of symbols imported from `@angular/core`.
<code-example path="attribute-directives/src/app/highlight.directive.3.ts" linenums="false" title="src/app/highlight.directive.ts (imports)" region="imports"></code-example>
我们先从`@angular/core`中导入`Input`。 我们先从`@angular/core`中导入`Input`。
<code-example path="attribute-directives/src/app/highlight.directive.3.ts" linenums="false" title="src/app/highlight.directive.ts (imports)" region="imports"></code-example>
Add a `highlightColor` property to the directive class like this: Add a `highlightColor` property to the directive class like this:
然后把`highlightColor`属性添加到指令类中，就像这样： 然后把`highlightColor`属性添加到指令类中，就像这样：

3
aio/content/guide/change-log.md
View File

@ -16,6 +16,7 @@ This log calls attention to recent significant changes.
## All mention of moduleId removed. "Component relative paths" guide deleted (2017-03-13) ## All mention of moduleId removed. "Component relative paths" guide deleted (2017-03-13)
## 移除了所有的moduleId引用。移除了“组件相对路径” 的烹饪书。(2017-03-13) ## 移除了所有的moduleId引用。移除了“组件相对路径” 的烹饪书。(2017-03-13)
We added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration. We added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration.
This plugin dynamically converts "component-relative" paths in templateUrl and styleUrls to "absolute paths" for you. This plugin dynamically converts "component-relative" paths in templateUrl and styleUrls to "absolute paths" for you.
@ -254,6 +255,7 @@ The documentation for the version prior to v.2.2.0 has been removed.
The updated TypeScript to JavaScript guide explains how to write apps in ES6/7 The updated TypeScript to JavaScript guide explains how to write apps in ES6/7
更新了“[从TypeScript到JavaScript](guide/ts-to-js)”烹饪宝典，解释如何使用ES6/7编写应用 更新了“[从TypeScript到JavaScript](guide/ts-to-js)”烹饪宝典，解释如何使用ES6/7编写应用
by translating the common idioms in the TypeScript documentation examples by translating the common idioms in the TypeScript documentation examples
(and elsewhere on the web) to ES6/7 and ES5. (and elsewhere on the web) to ES6/7 and ES5.
@ -406,6 +408,7 @@ The new "angular-in-memory-web-api" has new features.
[StyleGuide](guide/styleguide) explains recommended conventions for NgModules. [StyleGuide](guide/styleguide) explains recommended conventions for NgModules.
[StyleGuide](guide/styleguide)解释了我们为Angular模块（NgModule）而推荐的约定。 [StyleGuide](guide/styleguide)解释了我们为Angular模块（NgModule）而推荐的约定。
Barrels now are far less useful and have been removed from the style guide; Barrels now are far less useful and have been removed from the style guide;
they remain valuable but are not a matter of Angular style. they remain valuable but are not a matter of Angular style.
Also relaxed the rule that discouraged use of the `@Component.host` property. Also relaxed the rule that discouraged use of the `@Component.host` property.

1
aio/content/guide/cheatsheet.md
View File

@ -3,6 +3,7 @@
<h1 class="no-toc">速查表</h1> <h1 class="no-toc">速查表</h1>
<div id="cheatsheet"> <div id="cheatsheet">
<table class="is-full-width is-fixed-layout"> <table class="is-full-width is-fixed-layout">
<tbody><tr> <tbody><tr>
<th> <th>

6
aio/content/guide/component-styles.md
View File

@ -176,7 +176,9 @@ Component styles normally apply only to the HTML in the component's own template
Use the `/deep/` shadow-piercing descendant combinator to force a style down through the child Use the `/deep/` shadow-piercing descendant combinator to force a style down through the child
component tree into all the child component views. component tree into all the child component views.
The `/deep/` combinator works to any depth of nested components, and it applies to both the view The `/deep/` combinator works to any depth of nested components, and it applies to both the view
children and content children of the component. 我们可以使用`/deep/`选择器，来强制一个样式对各级子组件的视图也生效，它*不但作用于组件的子视图，也会作用于组件的内容*。 children and content children of the component.
我们可以使用`/deep/`选择器，来强制一个样式对各级子组件的视图也生效，它*不但作用于组件的子视图，也会作用于组件的内容*。
The following example targets all `<h3>` elements, from the host element down The following example targets all `<h3>` elements, from the host element down
through this component to all of its child elements in the DOM. through this component to all of its child elements in the DOM.
@ -438,9 +440,11 @@ Choose from the following modes:
Angular adds the CSS to the global styles. Angular adds the CSS to the global styles.
The scoping rules, isolations, and protections discussed earlier don't apply. The scoping rules, isolations, and protections discussed earlier don't apply.
This is essentially the same as pasting the component's styles into the HTML. This is essentially the same as pasting the component's styles into the HTML.
`None`意味着 Angular 不使用视图封装。 `None`意味着 Angular 不使用视图封装。
Angular 会把 CSS 添加到全局样式中。而不会应用上前面讨论过的那些作用域规则、隔离和保护等。 Angular 会把 CSS 添加到全局样式中。而不会应用上前面讨论过的那些作用域规则、隔离和保护等。
从本质上来说，这跟把组件的样式直接放进 HTML 是一样的。(译注：能进能出。) 从本质上来说，这跟把组件的样式直接放进 HTML 是一样的。(译注：能进能出。)
To set the components encapsulation mode, use the `encapsulation` property in the component metadata: To set the components encapsulation mode, use the `encapsulation` property in the component metadata:
通过组件元数据中的`encapsulation`属性来设置组件封装模式： 通过组件元数据中的`encapsulation`属性来设置组件封装模式：

10
aio/content/guide/dependency-injection-in-action.md
View File

@ -672,7 +672,7 @@ Here's a typical example:
Angular把该令牌传给注入器，然后把得到的结果赋给参数。下面是一个典型的例子： Angular把该令牌传给注入器，然后把得到的结果赋给参数。下面是一个典型的例子：
<code-example path="dependency-injection-in-action/src/app/hero-bios.component.ts" region="ctor" title="src/app/hero-bios.component.ts (组件构造器注入)" linenums="false"> <code-example path="dependency-injection-in-action/src/app/hero-bios.component.ts" region="ctor" title="src/app/hero-bios.component.ts" linenums="false">
</code-example> </code-example>
@ -719,7 +719,7 @@ usually in the `providers` array of the `Component` or `Directive` metadata:
Angular会使用一些自带的提供商来初始化这些注入器。我们必须自行注册属于_自己_的提供商，通常用`组件`或者`指令`元数据中的`providers`数组进行注册。 Angular会使用一些自带的提供商来初始化这些注入器。我们必须自行注册属于_自己_的提供商，通常用`组件`或者`指令`元数据中的`providers`数组进行注册。
<code-example path="dependency-injection-in-action/src/app/app.component.ts" region="providers" title="src/app/app.component.ts (提供商)"> <code-example path="dependency-injection-in-action/src/app/app.component.ts" region="providers" title="src/app/app.component.ts (providers)">
</code-example> </code-example>
@ -738,7 +738,7 @@ You mention the class in the `providers` array and you're done.
简单的类提供商是最典型的例子。只要在`providers`数值里面提到该类就可以了。 简单的类提供商是最典型的例子。只要在`providers`数值里面提到该类就可以了。
<code-example path="dependency-injection-in-action/src/app/hero-bios.component.ts" region="class-provider" title="src/app/hero-bios.component.ts (类提供商)" linenums="false"> <code-example path="dependency-injection-in-action/src/app/hero-bios.component.ts" region="class-provider" title="src/app/hero-bios.component.ts (class provider)" linenums="false">
</code-example> </code-example>
@ -1595,9 +1595,7 @@ Here's *Alex* and family in action:
Imagine one branch of a component hierarchy: *Alice* -> *Barry* -> *Carol*. Imagine one branch of a component hierarchy: *Alice* -> *Barry* -> *Carol*.
Both *Alice* and *Barry* implement the `Parent` *class-interface*. Both *Alice* and *Barry* implement the `Parent` *class-interface*.
想象组件树中的一个分支为：*Alice* -> *Barry* -> *Carol*。 想象组件树中的一个分支为：*Alice* -> *Barry* -> *Carol*。*Alice*和*Barry*都实现了这个`Parent`*类-接口*。
*Alice*和*Barry*都实现了这个`Parent`*类-接口*。
*Barry* is the problem. He needs to reach his parent, *Alice*, and also be a parent to *Carol*. *Barry* is the problem. He needs to reach his parent, *Alice*, and also be a parent to *Carol*.
That means he must both *inject* the `Parent` *class-interface* to get *Alice* and That means he must both *inject* the `Parent` *class-interface* to get *Alice* and

10
aio/content/guide/dependency-injection.md
View File

@ -266,6 +266,7 @@ and the `UserService` provided in `AppModule`.
{@a testing-the-component} {@a testing-the-component}
## Testing the component ## Testing the component
## 测试组件 ## 测试组件
Earlier you saw that designing a class for dependency injection makes the class easier to test. Earlier you saw that designing a class for dependency injection makes the class easier to test.
@ -861,7 +862,9 @@ The token description is another developer aid.
Register the dependency provider using the `InjectionToken` object: Register the dependency provider using the `InjectionToken` object:
使用这个`InjectionToken`对象注册依赖的提供商：<code-example path="dependency-injection/src/app/providers.component.ts" region="providers-9" linenums="false"> 使用这个`InjectionToken`对象注册依赖的提供商：
<code-example path="dependency-injection/src/app/providers.component.ts" region="providers-9" linenums="false">
</code-example> </code-example>
Now you can inject the configuration object into any constructor that needs it, with Now you can inject the configuration object into any constructor that needs it, with
@ -885,12 +888,15 @@ it supports typing of the configuration object within the class.
Alternatively, you can provide and inject the configuration object in an ngModule like `AppModule`. Alternatively, you can provide and inject the configuration object in an ngModule like `AppModule`.
或者在 ngModule 中提供并注入这个配置对象，如`AppModule`。<code-example path="dependency-injection/src/app/app.module.ts" region="providers" title="src/app/app.module.ts (providers)"></code-example> 或者在 ngModule 中提供并注入这个配置对象，如`AppModule`。
<code-example path="dependency-injection/src/app/app.module.ts" region="providers" title="src/app/app.module.ts (providers)"></code-example>
{@a optional} {@a optional}
## Optional dependencies ## Optional dependencies
## 可选依赖 ## 可选依赖
The `HeroService` *requires* a `Logger`, but what if it could get by without The `HeroService` *requires* a `Logger`, but what if it could get by without

6
aio/content/guide/deployment.md
View File

@ -129,8 +129,6 @@ Angular应用默认运行在开发模式下，正如在浏览器控制台中看
<code-example format="nocode"> <code-example format="nocode">
Angular is running in the development mode. Call enableProdMode() to enable the production mode. Angular is running in the development mode. Call enableProdMode() to enable the production mode.
（Angular正运行在开发模式下。调用enableProdMode()来启用生产模式）
</code-example> </code-example>
Switching to _production mode_ can make it run faster by disabling development specific checks such as the dual change detection cycles. Switching to _production mode_ can make it run faster by disabling development specific checks such as the dual change detection cycles.
@ -479,7 +477,9 @@ and to
[rewrite rule](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites). [rewrite rule](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites).
[Firebase主机服务](https://firebase.google.com/docs/hosting/)：添加一条[重写规则](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites)。<code-example format="."> [Firebase主机服务](https://firebase.google.com/docs/hosting/)：添加一条[重写规则](https://firebase.google.com/docs/hosting/url-redirects-rewrites#section-rewrites)。
<code-example format=".">
"rewrites": [ { "rewrites": [ {
"source": "**", "source": "**",
"destination": "/index.html" "destination": "/index.html"

80
aio/content/guide/forms.md
View File

@ -234,8 +234,9 @@ The `alterEgo` is optional, so the constructor lets you omit it; note the questi
You can create a new hero like this: You can create a new hero like this:
可以这样创建新英雄：
可以这样创建新英雄：<code-example path="forms/src/app/hero-form/hero-form.component.ts " linenums="false" region="SkyDog"> <code-example path="forms/src/app/hero-form/hero-form.component.ts " linenums="false" region="SkyDog">
</code-example> </code-example>
@ -367,7 +368,9 @@ access to all of the template-driven forms features, including `ngModel`.
Replace the contents of its template with the following: Replace the contents of its template with the following:
把“快速上手”的版本内容替换成下列代码：<code-example path="forms/src/app/app.component.html" title="src/app/app.component.html"> 把“快速上手”的版本内容替换成下列代码：
<code-example path="forms/src/app/app.component.html" title="src/app/app.component.html">
</code-example> </code-example>
@ -483,7 +486,9 @@ a technique seen previously in the [Displaying Data](guide/displaying-data) page
Add the following HTML *immediately below* the *Alter Ego* group: Add the following HTML *immediately below* the *Alter Ego* group:
在 *Alter Ego* 的紧下方添加如下 HTML：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (powers)" region="powers"> 在 *Alter Ego* 的紧下方添加如下 HTML：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (powers)" region="powers">
</code-example> </code-example>
@ -536,7 +541,9 @@ makes binding the form to the model easy.
Find the `<input>` tag for *Name* and update it like this: Find the `<input>` tag for *Name* and update it like this:
找到 *Name* 对应的`<input>`标签，并且像这样修改它：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModelName-1"> 找到 *Name* 对应的`<input>`标签，并且像这样修改它：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModelName-1">
</code-example> </code-example>
@ -561,7 +568,9 @@ a template variable for the form. Update the `<form>` tag with
`#heroForm="ngForm"` as follows: `#heroForm="ngForm"` as follows:
我们需要更多的工作来显示数据。在表单中声明一个模板变量。往`<form>`标签中加入`#heroForm="ngForm"`，代码如下：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="template-variable"> 我们需要更多的工作来显示数据。在表单中声明一个模板变量。往`<form>`标签中加入`#heroForm="ngForm"`，代码如下：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="template-variable">
</code-example> </code-example>
@ -576,13 +585,19 @@ The variable `heroForm` is now a reference to the `NgForm` directive that govern
### The _NgForm_ directive ### The _NgForm_ directive
### `NgForm`指令What `NgForm` directive? ### `NgForm`指令
What `NgForm` directive?
You didn't add an [NgForm](api/forms/NgForm) directive. You didn't add an [NgForm](api/forms/NgForm) directive.
什么是`NgForm`指令？ 什么是`NgForm`指令？
但我们明明没有添加过[NgForm](api/forms/NgForm)指令啊！Angular did. Angular automatically creates and attaches an `NgForm` directive to the `<form>` tag. 但我们明明没有添加过[NgForm](api/forms/NgForm)指令啊！
Angular替你做了。Angular会在`<form>`标签上自动创建并附加一个`NgForm`指令。The `NgForm` directive supplements the `form` element with additional features. Angular did. Angular automatically creates and attaches an `NgForm` directive to the `<form>` tag.
Angular替你做了。Angular会在`<form>`标签上自动创建并附加一个`NgForm`指令。
The `NgForm` directive supplements the `form` element with additional features.
It holds the controls you created for the elements with an `ngModel` directive It holds the controls you created for the elements with an `ngModel` directive
and `name` attribute, and monitors their properties, including their validity. and `name` attribute, and monitors their properties, including their validity.
It also has its own `valid` property which is true only *if every contained It also has its own `valid` property which is true only *if every contained
@ -660,7 +675,9 @@ Then you can confirm that two-way data binding works *for the entire hero model*
After revision, the core of the form should look like this: After revision, the core of the form should look like this:
修改之后，这个表单的核心是这样的：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModel-2"> 修改之后，这个表单的核心是这样的：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModel-2">
</code-example> </code-example>
@ -670,7 +687,10 @@ After revision, the core of the form should look like this:
* Each input element has an `id` property that is used by the `label` element's `for` attribute * Each input element has an `id` property that is used by the `label` element's `for` attribute
to match the label to its input control. to match the label to its input control.
每个 input 元素都有`id`属性，`label`元素的`for`属性用它来匹配到对应的输入控件。* Each input element has a `name` property that is required by Angular forms to register the control with the form.
每个 input 元素都有`id`属性，`label`元素的`for`属性用它来匹配到对应的输入控件。
* Each input element has a `name` property that is required by Angular forms to register the control with the form.
每个 input 元素都有`name`属性，Angular 表单用它注册控件。 每个 input 元素都有`name`属性，Angular 表单用它注册控件。
@ -834,7 +854,9 @@ to the _Name_ `<input>` tag and use it to display the input's CSS classes.
往姓名`<input>`标签上添加名叫 **spy** 的临时[模板引用变量](guide/template-syntax#ref-vars)， 往姓名`<input>`标签上添加名叫 **spy** 的临时[模板引用变量](guide/template-syntax#ref-vars)，
然后用这个 spy 来显示它上面的所有 CSS 类。<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModelName-2"> 然后用这个 spy 来显示它上面的所有 CSS 类。
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="ngModelName-2">
</code-example> </code-example>
@ -960,7 +982,9 @@ To achieve this effect, extend the `<input>` tag with the following:
Here's an example of an error message added to the _name_ input box: Here's an example of an error message added to the _name_ input box:
这个例子中我们把一条错误信息添加到了_name_输入框中：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="name-with-error-msg"> 这个例子中我们把一条错误信息添加到了_name_输入框中：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="name-with-error-msg">
</code-example> </code-example>
@ -989,7 +1013,9 @@ You control visibility of the name error message by binding properties of the `n
control to the message `<div>` element's `hidden` property. control to the message `<div>` element's `hidden` property.
我们把`div`元素的`hidden`属性绑定到`name`控件的属性，这样就可以控制“姓名”字段错误信息的可见性了。<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (hidden-error-msg)" region="hidden-error-msg"> 我们把`div`元素的`hidden`属性绑定到`name`控件的属性，这样就可以控制“姓名”字段错误信息的可见性了。
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (hidden-error-msg)" region="hidden-error-msg">
</code-example> </code-example>
@ -1034,7 +1060,9 @@ Place a *New Hero* button at the bottom of the form and bind its click event to
我们希望在这个表单中添加新的英雄。 我们希望在这个表单中添加新的英雄。
在表单的底部放置“New Hero（新增英雄）”按钮，并把它的点击事件绑定到`newHero`组件。<code-example path="forms/src/app/hero-form/hero-form.component.html" region="new-hero-button-no-reset" title="src/app/hero-form/hero-form.component.html (New Hero button)"> 在表单的底部放置“New Hero（新增英雄）”按钮，并把它的点击事件绑定到`newHero`组件。
<code-example path="forms/src/app/hero-form/hero-form.component.html" region="new-hero-button-no-reset" title="src/app/hero-form/hero-form.component.html (New Hero button)">
</code-example> </code-example>
@ -1072,7 +1100,9 @@ You have to clear all of the flags imperatively, which you can do
by calling the form's `reset()` method after calling the `newHero()` method. by calling the form's `reset()` method after calling the `newHero()` method.
我们必须清除所有标记，在调用`newHero()`方法后调用表单的`reset()`方法即可。<code-example path="forms/src/app/hero-form/hero-form.component.html" region="new-hero-button-form-reset" title="src/app/hero-form/hero-form.component.html (Reset the form)"> 我们必须清除所有标记，在调用`newHero()`方法后调用表单的`reset()`方法即可。
<code-example path="forms/src/app/hero-form/hero-form.component.html" region="new-hero-button-form-reset" title="src/app/hero-form/hero-form.component.html (Reset the form)">
</code-example> </code-example>
@ -1100,7 +1130,9 @@ to the hero form component's `onSubmit()` method:
现在这样仅仅触发“表单提交”是没用的。 现在这样仅仅触发“表单提交”是没用的。
要让它有用，就要把该表单的`ngSubmit`事件属性绑定到英雄表单组件的`onSubmit()`方法上：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (ngSubmit)" region="ngSubmit"> 要让它有用，就要把该表单的`ngSubmit`事件属性绑定到英雄表单组件的`onSubmit()`方法上：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (ngSubmit)" region="ngSubmit">
</code-example> </code-example>
@ -1117,7 +1149,9 @@ the `heroForm` variable to the button's `disabled` property
using an event binding. Here's the code: using an event binding. Here's the code:
我们要把表单的总体有效性通过`heroForm`变量绑定到此按钮的`disabled`属性上，代码如下：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (submit-button)" region="submit-button"> 我们要把表单的总体有效性通过`heroForm`变量绑定到此按钮的`disabled`属性上，代码如下：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (submit-button)" region="submit-button">
</code-example> </code-example>
@ -1185,7 +1219,9 @@ Wrap the form in a `<div>` and bind
its `hidden` property to the `HeroFormComponent.submitted` property. its `hidden` property to the `HeroFormComponent.submitted` property.
先把表单包裹进`<div>`中，再把它的`hidden`属性绑定到`HeroFormComponent.submitted`属性。<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="edit-div"> 先把表单包裹进`<div>`中，再把它的`hidden`属性绑定到`HeroFormComponent.submitted`属性。
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="edit-div">
</code-example> </code-example>
@ -1195,7 +1231,9 @@ as this fragment from the `HeroFormComponent` shows:
主表单从一开始就是可见的，因为`submitted`属性是 false，直到提交了这个表单。 主表单从一开始就是可见的，因为`submitted`属性是 false，直到提交了这个表单。
来自`HeroFormComponent`的代码片段告诉了我们这一点：<code-example path="forms/src/app/hero-form/hero-form.component.ts" linenums="false" title="src/app/hero-form/hero-form.component.ts (submitted)" region="submitted"> 来自`HeroFormComponent`的代码片段告诉了我们这一点：
<code-example path="forms/src/app/hero-form/hero-form.component.ts" linenums="false" title="src/app/hero-form/hero-form.component.ts (submitted)" region="submitted">
</code-example> </code-example>
@ -1209,7 +1247,9 @@ Add the following HTML below the `<div>` wrapper you just wrote:
现在，当表单处于已提交状态时，需要显示一些别的东西。 现在，当表单处于已提交状态时，需要显示一些别的东西。
在刚刚写的`<div>`包装下方，添加下列 HTML 语句：<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="submitted"> 在刚刚写的`<div>`包装下方，添加下列 HTML 语句：
<code-example path="forms/src/app/hero-form/hero-form.component.html" linenums="false" title="src/app/hero-form/hero-form.component.html (excerpt)" region="submitted">
</code-example> </code-example>

2
aio/content/guide/http.md
View File

@ -477,8 +477,6 @@ before making the next request.
region="update-headers" linenums="false"> region="update-headers" linenums="false">
</code-example> </code-example>
`HttpHeaders`类是不可变对象（immutable），所以每个`set()`都会返回一个新实例，并且应用上这些修改。
#### URL Parameters #### URL Parameters
#### URL 参数 #### URL 参数

1
aio/content/guide/ngmodule-faq.md
View File

@ -118,6 +118,7 @@ Membership in one list doesn't imply membership in another list.
* A component could be imported from another app module (so you can't declare it) and re-exported by this module. * A component could be imported from another app module (so you can't declare it) and re-exported by this module.
`HeroComponent`可能是从另一个应用模块中导入的（所以我们没法声明它）并且被当前模块重新导出。 `HeroComponent`可能是从另一个应用模块中导入的（所以我们没法声明它）并且被当前模块重新导出。
* A component could be exported for inclusion in an external component's template * A component could be exported for inclusion in an external component's template
as well as dynamically loaded in a pop-up dialog. as well as dynamically loaded in a pop-up dialog.

4
aio/content/guide/pipes.md
View File

@ -71,9 +71,6 @@ function on the right. All pipes work this way.
在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到 在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到
右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。 右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。
在这个插值表达式中，我们让组件的`birthday`值通过[管道操作符](guide/template-syntax#pipe)( | )流动到
右侧的[Date管道](api/common/DatePipe)函数中。所有管道都会用这种方式工作。
## Built-in pipes ## Built-in pipes
## 内置的管道 ## 内置的管道
@ -193,6 +190,7 @@ API Reference page.
## Chaining pipes ## Chaining pipes
## 链式管道 ## 链式管道
You can chain pipes together in potentially useful combinations. You can chain pipes together in potentially useful combinations.

16
aio/content/guide/router.md
View File

@ -2917,6 +2917,7 @@ It holds the _path to the `HeroListComponent`_:
{@a optional-route-parameters} {@a optional-route-parameters}
### Route Parameters: Required or optional? ### Route Parameters: Required or optional?
### 路由参数：必须还是可选？ ### 路由参数：必须还是可选？
Use [*route parameters*](#route-parameters) to specify a *required* parameter value *within* the route URL Use [*route parameters*](#route-parameters) to specify a *required* parameter value *within* the route URL
@ -3597,7 +3598,12 @@ any other feature's component.
This section shows you how to organize the crisis center This section shows you how to organize the crisis center
to conform to the following recommended pattern for Angular applications: to conform to the following recommended pattern for Angular applications:
本节会展示如何组织危机中心，来满足Angular应用所推荐的模式：* Each feature area resides in its own folder. 把每个特性放在自己的目录中。 本节会展示如何组织危机中心，来满足Angular应用所推荐的模式：
* Each feature area resides in its own folder.
把每个特性放在自己的目录中。
* Each feature has its own Angular feature module. * Each feature has its own Angular feature module.
每个特性都有自己的Angular特性模块。 每个特性都有自己的Angular特性模块。
@ -4003,7 +4009,13 @@ They differ in a few key respects.
第二路由很像主路由，配置方式也一样。它们只有一些关键的不同点： 第二路由很像主路由，配置方式也一样。它们只有一些关键的不同点：
* They are independent of each other. * They are independent of each other.
它们彼此互不依赖。* They work in combination with other routes. 它们与其它路由组合使用。
它们彼此互不依赖。
* They work in combination with other routes.
它们与其它路由组合使用。
* They are displayed in named outlets. * They are displayed in named outlets.
它们显示在命名出口中。 它们显示在命名出口中。

1
aio/content/guide/security.md
View File

@ -95,6 +95,7 @@ attacker-controlled data enters the DOM, expect security vulnerabilities.
如果攻击者所控制的数据混进了DOM，就会导致安全漏洞。 如果攻击者所控制的数据混进了DOM，就会导致安全漏洞。
### Angular’s cross-site scripting security model ### Angular’s cross-site scripting security model
### Angular的“跨站脚本安全模型” ### Angular的“跨站脚本安全模型”
To systematically block XSS bugs, Angular treats all values as untrusted by default. When a value To systematically block XSS bugs, Angular treats all values as untrusted by default. When a value

1
aio/content/guide/setup.md
View File

@ -63,6 +63,7 @@ Perform the _clone-to-launch_ steps with these terminal commands.
## Download ## Download
## 下载 ## 下载
<a href="https://github.com/angular/quickstart/archive/master.zip" title="Download the QuickStart seed repository">Download the QuickStart seed</a> <a href="https://github.com/angular/quickstart/archive/master.zip" title="Download the QuickStart seed repository">Download the QuickStart seed</a>
and unzip it into your project folder. Then perform the remaining steps with these terminal commands. and unzip it into your project folder. Then perform the remaining steps with these terminal commands.

3
aio/content/guide/styleguide.md
View File

@ -3498,8 +3498,6 @@ for example, in `/src/app`.
#### 风格 04-09 #### 风格 04-09
#### 风格 04-09
<div class="s-rule do"> <div class="s-rule do">
@ -5274,6 +5272,7 @@ helps instantly identify which members of the component serve which purpose.
## Directives ## Directives
## 指令 ## 指令
{@a 06-01} {@a 06-01}

10
aio/content/guide/template-syntax.md
View File

@ -704,14 +704,19 @@ from the _source-to-view_, from _view-to-source_, and in the two-way sequence: _
<div class="alert is-important"> <div class="alert is-important">
<!-- placeholder -->
译注：由于 HTML attribute 和 DOM property 在中文中都被翻译成了“属性”，无法区分， 译注：由于 HTML attribute 和 DOM property 在中文中都被翻译成了“属性”，无法区分，
而接下来的部分重点是对它们进行比较。 而接下来的部分重点是对它们进行比较。
<!-- placeholder -->
我们无法改变历史，因此，在本章的翻译中，保留了它们的英文形式，不加翻译，以免混淆。 我们无法改变历史，因此，在本章的翻译中，保留了它们的英文形式，不加翻译，以免混淆。
本章中，如果提到“属性”的地方，一定是指 property，因为在 Angular 中，实际上很少涉及 attribute。 本章中，如果提到“属性”的地方，一定是指 property，因为在 Angular 中，实际上很少涉及 attribute。
<!-- placeholder -->
但在其它章节中，为简单起见，凡是能通过上下文明显区分开的，就仍统一译为“属性”， 但在其它章节中，为简单起见，凡是能通过上下文明显区分开的，就仍统一译为“属性”，
区分不明显的，会加注英文。 区分不明显的，会加注英文。
@ -1556,8 +1561,6 @@ And you get this error:
<code-example format="nocode"> <code-example format="nocode">
Template parse errors: Template parse errors:
Can't bind to 'colspan' since it isn't a known native property Can't bind to 'colspan' since it isn't a known native property
（模板解析错误：不能绑定到 'colspan'，因为它不是已知的原生属性）
</code-example> </code-example>
As the message says, the `<td>` element does not have a `colspan` property. As the message says, the `<td>` element does not have a `colspan` property.
@ -1722,6 +1725,7 @@ Note that a _style property_ name can be written in either
{@a event-binding} {@a event-binding}
## Event binding ( <span class="syntax">(event)</span> ) ## Event binding ( <span class="syntax">(event)</span> )
## 事件绑定 ( <span class="syntax">(事件名)</span> ) ## 事件绑定 ( <span class="syntax">(事件名)</span> )
The bindings directives you've met so far flow data in one direction: **from a component to an element**. The bindings directives you've met so far flow data in one direction: **from a component to an element**.

5
aio/content/guide/upgrade.md
View File

@ -1180,6 +1180,7 @@ remains in "AngularJS land" and is managed by the AngularJS framework.
</div> </div>
### Transcluding Angular Content into AngularJS Component Directives ### Transcluding Angular Content into AngularJS Component Directives
### 把Angular的内容透传进AngularJS的组件型指令 ### 把Angular的内容透传进AngularJS的组件型指令
<img src="generated/images/guide/upgrade/a-to-ajs-with-transclusion.png" alt="Projecting Angular content into AngularJS" class="left"> <img src="generated/images/guide/upgrade/a-to-ajs-with-transclusion.png" alt="Projecting Angular content into AngularJS" class="left">
@ -1210,6 +1211,7 @@ the component tag with contents that will then get transcluded:
</code-example> </code-example>
### Making AngularJS Dependencies Injectable to Angular ### Making AngularJS Dependencies Injectable to Angular
### 让AngularJS中的依赖可被注入到Angular ### 让AngularJS中的依赖可被注入到Angular
When running a hybrid app, you may encounter situations where you need to inject When running a hybrid app, you may encounter situations where you need to inject
@ -1781,6 +1783,7 @@ You'll instead turn it directly into an Angular service.
所以我们不会在准备阶段中处理它，而是在下一节中直接把它转换成Angular服务。 所以我们不会在准备阶段中处理它，而是在下一节中直接把它转换成Angular服务。
### Installing Angular ### Installing Angular
### 安装Angular ### 安装Angular
Having completed the preparation work, get going with the Angular Having completed the preparation work, get going with the Angular
@ -2502,7 +2505,9 @@ It replaces the old AngularJS `ng-view` directive:
</code-example> </code-example>
#### Create the _Routing Module_ #### Create the _Routing Module_
#### 创建*路由模块* #### 创建*路由模块*
A router needs configuration whether it's the AngularJS or Angular or any other router. A router needs configuration whether it's the AngularJS or Angular or any other router.
无论在AngularJS还是Angular或其它框架中，路由器都需要进行配置。 无论在AngularJS还是Angular或其它框架中，路由器都需要进行配置。

8
aio/content/guide/user-input.md
View File

@ -17,6 +17,7 @@ Run the <live-example></live-example>.
## Binding to user input events ## Binding to user input events
## 绑定到用户输入事件 ## 绑定到用户输入事件
You can use [Angular event bindings](guide/template-syntax#event-binding) You can use [Angular event bindings](guide/template-syntax#event-binding)
@ -74,6 +75,7 @@ When the user clicks the button, Angular calls the `onClickMe` method from `Clic
## Get user input from the $event object ## Get user input from the $event object
## 通过 $event 对象取得用户输入 ## 通过 $event 对象取得用户输入
DOM events carry a payload of information that may be useful to the component. DOM events carry a payload of information that may be useful to the component.
@ -100,7 +102,7 @@ DOM event object in the `$event` variable which this code passes as a parameter
事件对象，上面的代码将它作为参数传递给`onKey()`方法。 事件对象，上面的代码将它作为参数传递给`onKey()`方法。
<code-example path="user-input/src/app/keyup.components.ts" region="key-up-component-1-class-no-type" title="src/app/keyup.components.ts (类 v.1)" linenums="false"> <code-example path="user-input/src/app/keyup.components.ts" region="key-up-component-1-class-no-type" title="src/app/keyup.components.ts (class v.1)" linenums="false">
</code-example> </code-example>
@ -374,6 +376,7 @@ To fix this issue, listen to both the _Enter_ key and the _blur_ event.
## Put it all together ## Put it all together
## 把它们放在一起 ## 把它们放在一起
The previous page showed how to [display data](guide/displaying-data). The previous page showed how to [display data](guide/displaying-data).
@ -406,9 +409,8 @@ Below is the "Little Tour of Heroes" component.
</code-example> </code-example>
### Observations ### Observations
### 小结 ### 小结
* **Use template variables to refer to elements** &mdash; * **Use template variables to refer to elements** &mdash;

3
aio/content/guide/webpack.md
View File

@ -97,7 +97,9 @@ This guide offers a taste of Webpack and explains how to use it with Angular app
[生产环境配置](guide/webpack#production-configuration) [生产环境配置](guide/webpack#production-configuration)
* [Test configuration](guide/webpack#test-configuration) * [Test configuration](guide/webpack#test-configuration)
[测试环境配置](guide/webpack#test-configuration) [测试环境配置](guide/webpack#test-configuration)
* [Trying it out](guide/webpack#try) * [Trying it out](guide/webpack#try)
[试一下](guide/webpack#try) [试一下](guide/webpack#try)
@ -544,6 +546,7 @@ and exports several objects as properties of a `module.exports` object.
* [`resolve`](guide/webpack#common-resolves)&mdash;how to resolve file names when they lack extensions. * [`resolve`](guide/webpack#common-resolves)&mdash;how to resolve file names when they lack extensions.
[`resolve`](guide/webpack#common-resolves) - 省略扩展名时如何解释文件名。 [`resolve`](guide/webpack#common-resolves) - 省略扩展名时如何解释文件名。
* [`module.rules`](guide/webpack#common-rules)&mdash; `module` is an object with `rules` for deciding how files are loaded. * [`module.rules`](guide/webpack#common-rules)&mdash; `module` is an object with `rules` for deciding how files are loaded.
[`module.rules`](guide/webpack#common-rules) - `module`是一个对象，里面的`rules`属性用来决定文件如何加载。 [`module.rules`](guide/webpack#common-rules) - `module`是一个对象，里面的`rules`属性用来决定文件如何加载。

1
aio/content/marketing/docs.md
View File

@ -6,6 +6,7 @@ Angular is a platform that makes it easy to build applications with the web. Ang
Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身，为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。 Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身，为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。
<div class="card-container"> <div class="card-container">
<a href="generated/live-examples/toh-pt1/stackblitz.html" target="_blank" class="docs-card" <a href="generated/live-examples/toh-pt1/stackblitz.html" target="_blank" class="docs-card"
title="通过线上编程环境体验 Angular"> title="通过线上编程环境体验 Angular">
<section>Angular 走马观花</section> <section>Angular 走马观花</section>

1
aio/content/translations/cn/news.md
View File

@ -1,4 +1,5 @@
# Angular News # Angular News
# Angular 新闻中心 # Angular 新闻中心
## Angular 组件库 NG-ZORRO 发布！ ## Angular 组件库 NG-ZORRO 发布！

2
aio/package.json
View File

@ -133,7 +133,7 @@
"karma-jasmine": "^1.1.0", "karma-jasmine": "^1.1.0",
"karma-jasmine-html-reporter": "^0.2.2", "karma-jasmine-html-reporter": "^0.2.2",
"lighthouse": "^2.5.0", "lighthouse": "^2.5.0",
"lodash": "^4.17.4", "lodash": "^4.17.5",
"lunr": "^2.1.0", "lunr": "^2.1.0",
"protractor": "^5.2.0", "protractor": "^5.2.0",
"rehype": "^4.0.0", "rehype": "^4.0.0",