fix: 修正合并时的错误

This commit is contained in:
Zhicheng Wang 2018-07-27 20:22:07 +08:00
parent a430e4d64f
commit 966a29e072
15 changed files with 71 additions and 36 deletions

View File

@ -159,9 +159,13 @@ You can control your app compilation by providing template compiler options in t
```
### *enableResourceInlining*
This options tell the compiler to replace the `templateUrl` and `styleUrls` property in all `@Component` decorators with inlined contents in `template` and `styles` properties.
When enabled, the `.js` output of ngc will have no lazy-loaded `templateUrl` or `styleUrls`.
这个选项告诉编译器把所有 `@Component` 装饰器中的 `templateUrl``styleUrls` 属性内联成 `template``styles` 属性。
当启用时ngc 的 `.js` 输出中将不会有惰性加载的 `templateUrl``styleUrls`
### *skipMetadataEmit*
This option tells the compiler not to produce `.metadata.json` files.
@ -376,20 +380,26 @@ Tells the compiler to generate all the possible generated files even if they are
how `bazel` rules track file dependencies. It is not recommended to use this option outside of the `bazel`
rules.
告诉编译器生成所有可能生成的文件 —— 即使是空文件。
告诉编译器生成所有可能生成的文件 —— 即使是空文件。
该选项默认为 `false`
这是供 `bazel` 构建规则使用的选项,它用于简化 `bazel` 规则跟踪文件依赖的方式。
除了 `bazel` 规则之外不建议使用该选项。### *enableIvy*
除了 `bazel` 规则之外不建议使用该选项。
### *enableIvy*
Tells the compiler to generate definitions using the Render3 style code generation. This option defaults to `false`.
告诉编译器使用 Render3 风格的代码生成器来来生成各种定义。
该选项默认为 `false`。Not all features are supported with this option enabled. It is only supported
告诉编译器使用 Render3 风格的代码生成器来来生成各种定义。
该选项默认为 `false`
Not all features are supported with this option enabled. It is only supported
for experimentation and testing of Render3 style code generation.
当开启该选项时,有些特性不受支持。它仅仅用来为试验和测试 Render3 风格的代码生成提供支持。*Note*: Is it not recommended to use this option as it is not yet feature complete with the Render2 code generation.
当开启该选项时,有些特性不受支持。它仅仅用来为试验和测试 Render3 风格的代码生成提供支持。
*注意*:不建议使用该选项,因为它在使用 Render2 的代码生成器时还缺少一些特性。
*Note*: Is it not recommended to use this option as it is not yet feature complete with the Render2 code generation.
*注意*:不建议使用该选项,因为它在使用 Render2 的代码生成器时还缺少一些特性。
## Angular Metadata and AOT

View File

@ -30,6 +30,7 @@ For example, the `HeroListComponent` has a `heroes` property that holds an array
比如,`HeroListComponent` 有一个 `heroes` 属性,它会返回一个从服务中取到的英雄数组。
`HeroListComponent` 还有一个 `selectHero()` 方法,当用户从列表中选择一个英雄时,它会设置 `selectedHero` 属性的值。
该组件会从服务获取英雄列表,它是一个 TypeScript 的构造器[参数型属性](http://www.typescriptlang.org/docs/handbook/classes.html#parameter-properties)。本服务通过依赖注入系统提供给该组件。
<code-example path="architecture/src/app/hero-list.component.ts" linenums="false" title="src/app/hero-list.component.ts (class)" region="class"></code-example>
@ -86,7 +87,7 @@ Angular inserts an instance of the `HeroListComponent` view between those tags.
* `providers`: An array of **dependency injection providers** for services that the component requires. In the example, this tells Angular how to provide the `HeroService` instance that the component's constructor uses to get the list of heroes to display.
`providers` 是当前组件所需的**依赖注入提供商**的一个数组。在这个例子中,它告诉 Angular,该组件的构造函数需要一个 `HeroService` 实例,以获取要显示的英雄列表。
`providers` 是当前组件所需的**依赖注入提供商**的一个数组。在这个例子中,它告诉 Angular 该如何提供一个 `HeroService` 实例,以获取要显示的英雄列表。
<hr/>

View File

@ -158,7 +158,8 @@ For example, import Angular's `Component` decorator from the `@angular/core` lib
You also import NgModules from Angular _libraries_ using JavaScript import statements.
For example, the following code imports the `BrowserModule` NgModule from the `platform-browser` library:
还可以使用 JavaScript 的导入语句从 Angular *库*中导入 Angular *模块*
还可以使用 JavaScript 的导入语句从 Angular *库*中导入 Angular *模块*
比如,下列代码从 `platform-browser` 库中导入了 `BrowserModule` 这个 NgModule。
<code-example path="architecture/src/app/mini-app.ts" region="import-browser-module" linenums="false"></code-example>

View File

@ -480,8 +480,8 @@ for shadow DOM (see [Shadow DOM v1](https://caniuse.com/#feat=shadowdomv1) on th
which is why `Emulated` view encapsulation is the default mode and recommended
in most cases.
原生(`Native`)模式只适用于[有原生 Shadow DOM 支持的浏览器](http://caniuse.com/#feat=shadowdom)
因此仍然受到很多限制,这就是为什么仿真 (`Emulated`) 模式是默认选项,并建议将其用于大多数情况。
`ShadowDom` 模式只适用于提供了原生 Shadow DOM 支持的浏览器(参见 [Can I use](http://caniuse.com/) 上的 [Shadow DOM v1](https://caniuse.com/#feat=shadowdomv1) 部分)
仍然受到很多限制,这就是为什么仿真 (`Emulated`) 模式是默认选项,并建议将其用于大多数情况。
{@a inspect-generated-css}

View File

@ -4,7 +4,7 @@
_Angular elements_ are Angular components packaged as _custom elements_, a web standard for defining new HTML elements in a framework-agnostic way.
Angular 元素就是打包成自定义元素的 Angular 组件。所谓自定义元素就是一套与具体框架无关的用于定义新 HTML 元素的 Web 标准。
*Angular 元素*就是打包成*自定义元素*的 Angular 组件。所谓自定义元素就是一套与具体框架无关的用于定义新 HTML 元素的 Web 标准。
[Custom elements](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) are a Web Platform feature currently supported by Chrome, Opera, and Safari, and available in other browsers through polyfills (see [Browser Support](#browser-support)).
A custom element extends HTML by allowing you to define a tag whose content is created and controlled by JavaScript code.
@ -21,12 +21,19 @@ The `@angular/elements` package exports a `createCustomElement()` API that provi
Transforming a component to a custom element makes all of the required Angular infrastructure available to the browser.
Creating a custom element is simple and straightforward, and automatically connects your component-defined view with change detection and data binding, mapping Angular functionality to the corresponding native HTML equivalents.
把组件转换成自定义元素可以让所有所需的 Angular 基础设施都在浏览器中可用。
创建自定义元素的方式简单直接,并且会自动把你组件定义的视图连同变更检测与数据绑定等 Anuglar 的功能映射为相应的原生 HTML 等价物。
<div class="alert is-helpful">
We are working on custom elements that can be used by web apps built on other frameworks.
A minimal, self-contained version of the Angular framework will be injected as a service to support the component's change-detection and data-binding functionality.
For more about the direction of development, check out this [video presentation](https://www.youtube.com/watch?v=Z1gLFPLVJjY&t=4s).
我们正在持续开发自定义元素功能,让它们可以用在由其它框架所构建的 Web 应用中。
Angular 框架的一个小型的、自包含的版本将会作为服务注入进去,以提供组件的变更检测和数据绑定功能。
要了解这个开发方向的更多内容,参见[这个视频演讲](https://www.youtube.com/watch?v=Z1gLFPLVJjY&t=4s)。
</div>
把组件转换成自定义元素会让所需的 Angular 基础设施也可用在浏览器中。创建自定义元素非常简单直接,它会自动把你的组件视图对接到变更检测和数据绑定机制,会把 Angular 的功能映射到原生 HTML 中的等价物。

View File

@ -277,7 +277,8 @@ Understanding this component requires only the Angular concepts covered in previ
* The `@Component` selector value of "app-hero-form" means you can drop this form in a parent
template with a `<app-hero-form>` tag.
`@Component` 选择器“hero-form”表示可以用 `<hero-form>` 标签把这个表单放进父模板。
`@Component` 选择器“hero-form”表示可以用 `<app-hero-form>` 标签把这个表单放进父模板。
* The `templateUrl` property points to a separate file for the template HTML.
`moduleId: module.id` 属性设置了基地址,用于从相对模块路径加载 `templateUrl`

View File

@ -146,7 +146,12 @@ Angular 应用需要不止一个模块,它们都为根模块服务。
<tr>
<td><code>RouterModule</code></td>
<td><code>@angular/router</code></td>
<td>When you want to use <code>RouterLink</code>,<code>.forRoot()</code>, and <code>.forChild()</code>要使用路由功能,并且你要用到 <code>RouterLink</code>,<code>.forRoot()</code><code>.forChild()</code></td>
<td>
When you want to use <code>RouterLink</code>,<code>.forRoot()</code>, and <code>.forChild()</code>
要使用路由功能,并且你要用到 <code>RouterLink</code>,<code>.forRoot()</code><code>.forChild()</code>
</td>
</tr>
<tr>

View File

@ -216,12 +216,12 @@ The [Angular CLI](https://cli.angular.io/) is a command-line tool for managing t
A class with the `@Component` [decorator](guide/glossary#decorator) that associates it with a companion [template](guide/glossary#template). Together, the component and template define a [view](guide/glossary#view).
一个带有 `@Component` [装饰器](guide/glossary#decorator)的类,用来为它关联一个与之相伴的[模板](guide/glossary#template)。
一个带有 `@Component` [装饰器](guide/glossary#decorator)的类,和它的伴生[模板](guide/glossary#template)关联在一起。组件及其模板共同定义了一个[视图](guide/glossary#view)。
A component is a special type of [directive](guide/glossary#directive).
The `@Component` decorator extends the `@Directive` decorator with template-oriented features.
组件是[指令](guide/glossary#directive)的一种特例,它表示一个[视图](guide/glossary#view)`@Component` 装饰器扩展了 `@Directive` 装饰器,增加了一些与模板有关的特性。
组件是[指令](guide/glossary#directive)的一种特例。`@Component` 装饰器扩展了 `@Directive` 装饰器,增加了一些与模板有关的特性。
An Angular component class is responsible for exposing data and handling most of the view's display and user-interaction logic through [data binding](guide/glossary#data-binding).
@ -381,7 +381,7 @@ A design pattern and mechanism for creating and delivering parts of an applicati
In Angular, dependencies are typically services, but can also be values, such as strings or functions.
An [injector](guide/glossary#injector) for an app (created automatically during bootstrap) instantiates dependencies when needed, using a configured [provider](guide/glossary#provider) of the service or value.
在 Angular 中,依赖通常是服务,但是也可以是值,比如字符串或函数。应用的[注入器](guide/glossary#injector)(它是在启动期间自动创建的)会使用该服务或值的已注册[提供商](guide/glossary#provider)来按需创建这些依赖。各个不同的提供商可以为同一个服务提供不同的实现。
在 Angular 中,依赖通常是服务,但是也可以是值,比如字符串或函数。应用的[注入器](guide/glossary#injector)(它是在启动期间自动创建的)会使用该服务或值的配置好的[提供商](guide/glossary#provider)来按需实例化这些依赖。各个不同的提供商可以为同一个服务提供不同的实现。
Learn more in the [Dependency Injection](guide/dependency-injection) guide.
@ -548,16 +548,25 @@ using a configured [provider](guide/glossary#provider).
Injectors are created for NgModules automatically as part of the bootstrap process
and are inherited through the component hierarchy.
Angular [依赖注入系统](guide/glossary#dependency-injection)中可以在缓存中根据名字查找依赖,也可以通过配置过的[提供商](guide/glossary#provider)来创建依赖。
启动过程中会自动为每个模块创建一个注入器,并被组件树继承。
* An injector provides a singleton instance of a dependency, and can inject this same instance in multiple components.
注入器会提供依赖的一个单例,并把这个单例对象注入到多个组件中。
* A hierarchy of injectors at the NgModule and component level can provide different instances of a dependency to their own components and child components.
模块和组件级别的注入器树可以为它们拥有的组件及其子组件提供同一个依赖的不同实例。
* You can configure injectors with different providers that can provide different implementations of the same dependency.
你可以为同一个依赖使用不同的提供商来配置这些注入器,这些提供商可以为依赖提供不同的实现。
Learn more about the injector hierarchy in the [Dependency Injection guide](guide/hierarchical-dependency-injection).
Angular [依赖注入系统](guide/glossary#dependency-injection)中可以在缓存中根据名字查找依赖,也可以通过已注册的[提供商](guide/glossary#provider)来创建依赖。
启动过程中会自动为每个模块创建一个注入器,并被组件树继承。
要了解关于多级注入器的更多知识,参见[依赖注入](guide/hierarchical-dependency-injection)一章。
## Input
@ -789,7 +798,7 @@ Angular 使用一个名叫[响应式扩展 (RxJS)](http://reactivex.io/rxjs/)的
To learn more, see the [Observables](guide/observables) guide.
要了解更多,参见[可观察对象](guide/glossary#observable)。
要了解更多,参见[可观察对象](guide/observables)。
{@a observer}
@ -986,7 +995,7 @@ A way to group related npm packages.
NgModules are delivered within *scoped packages* whose names begin with the Angular *scope name* `@angular`. For example, `@angular/core`, `@angular/common`, `@angular/forms`, and `@angular/router`.
一种把相关的 NPM 包分组到一起的方式。
Angular 的 NgModule 都是在一些以 `@angular` 为范围名的*范围化包*中发布的。比如 `@angular/core``@angular/common``@angular/http` 和 `@angular/router`
Angular 的 NgModule 都是在一些以 `@angular` 为范围名的*范围化包*中发布的。比如 `@angular/core``@angular/common``@angular/forms` 和 `@angular/router`
Import a scoped package in the same way that you import a normal package.

View File

@ -683,8 +683,6 @@ If there is a search term, the code constructs an options object with an HTML UR
如果有搜索词,这段代码就会构造一个包含进行过 URL 编码的搜索词的选项对象。如果这个搜索词是“foo”这个 GET 请求的 URL 就会是 `api/heroes/?name=foo`
如果有搜索词,这段代码就会构造一个包含进行过 URL 编码的搜索词的选项对象。如果这个搜索词是“foo”这个 GET 请求的 URL 就会是 `api/heroes/?name=foo`
The `HttpParams` are immutable so you'll have to use the `set()` method to update the options.
`HttpParams` 是不可变的,所以你也要使用 `set()` 方法来修改这些选项。

View File

@ -81,7 +81,7 @@ By default, Angular uses the locale `en-US`, which is English as spoken in the U
To set your app's locale to another value, use the CLI parameter `--configuration` with the value of the locale id that you want to use:
要把你的应用的地区改为其它值,可以使用 CLI 参数 `--locale` 来传入你要使用的地区标识:
要把你的应用的地区改为其它值,可以使用 CLI 参数 `--configuration` 来传入你要使用的地区标识:
<code-example language="sh" class="code-shell">
ng serve --configuration=fr
@ -139,7 +139,7 @@ The CLI imports the locale data for you when you use the parameter `--configurat
`ng build`.
默认情况下Angular 只包含 `en-US` 的本地化数据。如果你要把 `LOCALE_ID` 的值设置为其它地区,就必须为那个新地区导入本地化数据。
当你使用 `ng serve``ng build``--locale` 参数时CLI 会自动帮你导入相应的本地化数据。
当你使用 `ng serve``ng build``--configuration` 参数时CLI 会自动帮你导入相应的本地化数据。
If you want to import locale data for other languages, you can do it manually:
@ -164,8 +164,10 @@ locale id "fr-FR" instead of "fr".
The files in `@angular/common/locales` contain most of the locale data that you
need, but some advanced formatting options might only be available in the extra dataset that you can
import from `@angular/common/locales/extra`. An error message informs you when this is the case.
`@angular/common/locales` 中的文件包含你需要的大多数本地化数据,
`@angular/common/locales` 中的文件包含你需要的大多数本地化数据,
不过有些高级的格式选项只存在于从 `@angular/common/locales/extra` 中导入的扩展数据集中。遇到这种情况,你就会收到一条错误信息。
<code-example path="i18n/doc-files/app.locale_data_extra.ts" region="import-locale-extra" title="src/app/app.module.ts" linenums="false">
</code-example>
@ -715,7 +717,7 @@ The sample in this guide uses the default XLIFF 1.2 format.
You can specify the output path used by the CLI to extract your translation source file with
the parameter `--output-path`:
你还可以使用 `--outputPath` 参数在 CLI 提取翻译源文件时指定输出路径:
你还可以使用 `--output-path` 参数在 CLI 提取翻译源文件时指定输出路径:
<code-example language="sh" class="code-shell">
@ -726,7 +728,7 @@ the parameter `--output-path`:
You can change the name of the translation source file that is generated by the extraction tool with
the parameter `--outFile`:
你还可以使用 `--outFile` 参数来为提取工具生成的翻译源文件改名:
你还可以使用 `--out-file` 参数来为提取工具生成的翻译源文件改名:
<code-example language="sh" class="code-shell">
@ -736,7 +738,7 @@ the parameter `--outFile`:
You can specify the base locale of your app with the parameter `--i18n-locale`:
你还可以使用 `--locale` 参数来指定应用的基本地区:
你还可以使用 `--i18n-locale` 参数来指定应用的基本地区:
<code-example language="sh" class="code-shell">
@ -1091,7 +1093,7 @@ detection or url parameters.
You also need to instruct the AOT compiler to use your translation configuration. To do so, you configure the translation with three options in your `angular.json` file.
你还要指示 AOT 编译器使用你的翻译结果文件,要这么做,你就要在 `ng serve``ng build` 命令中使用三个选项:
你还要指示 AOT 编译器使用你的翻译配置,要这么做,你就要在 `angular.json` 文件中使用三个选项来配置翻译信息。
* `i18nFile`: the path to the translation file.

View File

@ -86,8 +86,8 @@ The `pipe()` function is also a method on the RxJS `Observable`, so you use this
RxJS provides many operators, but only a handful are used frequently. For a list of operators and usage samples, visit the [RxJS API Documentation](https://rxjs-dev.firebaseapp.com/api).
RxJS 提供了很多操作符(超过 150 个),不过只有少数是常用的。
下面是一个常用操作符的列表,要查看用法范例,参见 RxJS 文档中的 [RxJS 5 操作符范例](https://github.com/btroncone/learn-rxjs/blob/master/operators/complete.md)。
RxJS 提供了很多操作符,不过只有少数是常用的。
下面是一个常用操作符的列表和用法范例,参见 [RxJS API 文档](https://rxjs-dev.firebaseapp.com/api)。
<div class="alert is-helpful">
Note that, for Angular apps, we prefer combining operators with pipes, rather than chaining. Chaining is used in many RxJS examples.

View File

@ -179,7 +179,7 @@ Angular 认为这些值是不安全的,并自动进行无害化处理。它会
### Direct use of the DOM APIsand explicit sanitization calls
### Direct use of the DOM APIs and explicit sanitization calls
### 避免直接使用 DOM API

View File

@ -2962,7 +2962,8 @@ module are referenced across the entire application.
singletons that are provided once for the entire application or
in a particular feature module. There are exceptions, however. For example, in the sample code that follows, notice that the `SharedModule` provides `FilterTextService`. This is acceptable here because the service is stateless;that is, the consumers of the service aren't impacted by new instances.
**避免** 在共享模块中提供服务。服务通常是单例的,应该在整个应用或一个特定的特性模块中只有一份。
**考虑** *不要*在共享模块中提供服务。服务通常是单例的,应该在整个应用或一个特定的特性模块中只有一份。
不过也有例外,比如,在下面的范例代码中,注意 `SharedModule` 提供了 `FilterTextService`。这里可以这么做,因为该服务是无状态的,也就是说,该服务的消费者不会受到这些新实例的影响。
</div>

View File

@ -422,7 +422,7 @@ and with relative URLs when running in the browser.
One solution is to provide the server's runtime origin under the Angular [`APP_BASE_HREF` token](api/common/APP_BASE_HREF),
inject it into the service, and prepend the origin to the request URL.
解决方案之一是通过 Angular 的 [`APP_BASE_REF` 令牌](api/common/APP_BASE_HREF)来提供服务器的源地址origin把它注入到服务中并把这个源地址添加到所请求的 URL 之前。
解决方案之一是通过 Angular 的 [`APP_BASE_HREF` 令牌](api/common/APP_BASE_HREF)来提供服务器的源地址origin把它注入到服务中并把这个源地址添加到所请求的 URL 之前。
Start by changing the `HeroService` constructor to take a second `origin` parameter that is optionally injected via the `APP_BASE_HREF` token.
@ -847,7 +847,7 @@ CLI 提供了针对不同**目标**的构建器。常见的目标,如 `build`
Now that you've created the TypeScript and Webpack config files and configured the Angular CLI, you can build and run the Universal application.
现在,你已经创建了 TypeScript 和 Webpack 的配置文件,可以构建并运行这个 Universal 应用了。
现在,你已经创建了 TypeScript 和 Webpack 的配置文件并配置好了 Angular CLI,可以构建并运行这个 Universal 应用了。
First add the _build_ and _serve_ commands to the `scripts` section of the `package.json`:

View File

@ -5,7 +5,7 @@
_Angular_ is the name for the Angular of today and tomorrow.<br />
_AngularJS_ is the name for all 1.x versions of Angular.
*Angular* 这个名字专指现在和未来的 Angular 版本,而 *AngularJS* 专指 Angular 的所有 v1.x 版本。
*Angular* 这个名字专指现在和未来的 Angular 版本,而 *AngularJS* 专指 Angular 的所有 1.x 版本。
AngularJS apps are great.
Always consider the business case before moving to Angular.