fix: 合并第二版的翻译
This commit is contained in:
parent
ba33ee016a
commit
fc58e0eee0
|
@ -128,7 +128,7 @@
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
@ -311,7 +311,7 @@
|
|||
</span><span class="pun">}[],</span><span class="pln"> duration</span><span class="pun">:</span><span class="pln"> number</span><span class="pun">,</span><span class="pln"> delay</span><span class="pun">:</span><span class="pln"> number</span><span class="pun">,</span><span class="pln"> easing</span><span class="pun">:</span><span class="pln"> </span><span class="kwd">string</span><span class="pun">,</span><span class="pln"> previousPlayers</span><span class="pun">:</span><span class="pln"> any</span><span class="pun">[])</span></code>
|
||||
</pre></aio-code></code-example>
|
||||
|
||||
</td>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
|
|
|
@ -57,7 +57,7 @@ NgModules are a big deal.
|
|||
This page introduces modules; the [NgModules](guide/ngmodules) pages
|
||||
relating to NgModules covers them in detail.
|
||||
|
||||
_Angular 模块_很重要。这里只是简单介绍,在 [Angular 模块](guide/ngmodule)中会做深入讲解。
|
||||
NgModules 很重要。这里只是简单介绍,在 [NgModules](guide/ngmodule)中会做深入讲解。
|
||||
|
||||
<br class="clear">
|
||||
|
||||
|
@ -229,7 +229,7 @@ Hang in there. The confusion yields to clarity with time and experience.
|
|||
|
||||
Learn more from the [NgModules](guide/ngmodules) page.
|
||||
|
||||
更多信息,见 [Angular 模块](guide/ngmodule)。
|
||||
更多信息,参见 [NgModules](guide/ngmodule)。
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
# Bootstrapping
|
||||
|
||||
# 启动过程
|
||||
|
||||
#### Prerequisites
|
||||
|
||||
A basic understanding of the following:
|
||||
|
@ -152,6 +154,8 @@ the class was imported from another module.
|
|||
You don't have any services to provide yet.
|
||||
But you will create some before long and you may chose to provide many of them here.
|
||||
|
||||
我们还没有提供任何服务,但是很快就会创建一些,而且可能也会选择在这里提供它们。
|
||||
|
||||
{@a bootstrap-array}
|
||||
|
||||
## The `providers` array
|
||||
|
@ -172,6 +176,9 @@ Each bootstrapped component is the base of its own tree of components.
|
|||
Inserting a bootstrapped component usually triggers a cascade of
|
||||
component creations that fill out that tree.
|
||||
|
||||
每个被引导的组件都是它自己的组件树的根。
|
||||
插入一个被引导的组件通常触发一系列组件的创建并形成组件树。
|
||||
|
||||
While you can put more than one component tree on a host web page,
|
||||
most applications have only one component tree and bootstrap a single root component.
|
||||
|
||||
|
@ -180,5 +187,7 @@ root module's `bootstrap` array.
|
|||
|
||||
## More about Angular Modules
|
||||
|
||||
## 关于Angular模块的更多知识
|
||||
|
||||
For more on NgModules you're likely to see frequently in apps,
|
||||
see [Frequently Used Modules](#).
|
||||
|
|
|
@ -414,9 +414,11 @@ Here are the features which may require additional polyfills:
|
|||
|
||||
[JIT compilation](guide/aot-compiler).
|
||||
|
||||
[JIT 编译](guide/aot-compiler)
|
||||
|
||||
Required to reflect for metadata.
|
||||
|
||||
[JIT 编译](guide/aot-compiler) 需要 reflect 来提供元数据。
|
||||
需要 reflect 来提供元数据。
|
||||
|
||||
</td>
|
||||
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
<h1 class="no-toc">Cheat Sheet</h1>
|
||||
|
||||
<h1 class="no-toc">速查表</h1>
|
||||
|
||||
<div id="cheatsheet">
|
||||
|
||||
<table class="is-full-width is-fixed-layout">
|
||||
|
@ -11,7 +13,9 @@
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -27,7 +31,11 @@
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>
|
||||
<td>
|
||||
|
||||
<p>Bootstraps the app, using the root component from the specified <code>NgModule</code>. </p>
|
||||
|
||||
<p>用 <code>NgModule</code> 中指定的根组件进行启动。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -44,7 +52,9 @@
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { NgModule } from '@angular/core';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { NgModule } from '@angular/core';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -60,7 +70,11 @@
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Defines a module that contains components, directives, pipes, and providers.</p>
|
||||
<td>
|
||||
|
||||
<p>Defines a module that contains components, directives, pipes, and providers.</p>
|
||||
|
||||
<p>定义一个模块,其中可以包含组件、指令、管道和服务提供商。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -72,7 +86,11 @@
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of components, directives, and pipes that belong to this module.</p>
|
||||
<td>
|
||||
|
||||
<p>List of components, directives, and pipes that belong to this module.</p>
|
||||
|
||||
<p>属于当前模块的组件、指令和管道的列表。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -84,9 +102,13 @@
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of modules to import into this module. Everything from the imported modules
|
||||
<td>
|
||||
|
||||
<p>List of modules to import into this module. Everything from the imported modules
|
||||
is available to <code>declarations</code> of this module.</p>
|
||||
|
||||
<p>本模块所导入的模块列表</p>
|
||||
|
||||
</td>
|
||||
|
||||
</tr><tr>
|
||||
|
@ -97,7 +119,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of components, directives, and pipes visible to modules that import this module.</p>
|
||||
<td>
|
||||
|
||||
<p>List of components, directives, and pipes visible to modules that import this module.</p>
|
||||
|
||||
<p>那些导入了本模块的模块所能看到的组件、指令和管道的列表</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -109,7 +135,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of dependency injection providers visible both to the contents of this module and to importers of this module.</p>
|
||||
<td>
|
||||
|
||||
<p>List of dependency injection providers visible both to the contents of this module and to importers of this module.</p>
|
||||
|
||||
<p>依赖注入提供商的列表,本模块以及本模块导入的所有模块中的内容都可以看见它们。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -121,7 +151,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of components to bootstrap when this module is bootstrapped.</p>
|
||||
<td>
|
||||
|
||||
<p>List of components to bootstrap when this module is bootstrapped.</p>
|
||||
|
||||
<p>当本模块启动时,随之启动的组件列表。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -154,7 +188,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds property <code>value</code> to the result of expression <code>firstName</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds property <code>value</code> to the result of expression <code>firstName</code>.</p>
|
||||
|
||||
<p>把<code>value</code>属性绑定到表达式<code>firstName</code></p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -166,7 +204,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds attribute <code>role</code> to the result of expression <code>myAriaRole</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds attribute <code>role</code> to the result of expression <code>myAriaRole</code>.</p>
|
||||
|
||||
<p>把属性(Attribute)<code>role</code>绑定到表达式<code>myAriaRole</code>的结果。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -178,7 +220,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the presence of the CSS class <code>extra-sparkle</code> on the element to the truthiness of the expression <code>isDelightful</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the presence of the CSS class <code>extra-sparkle</code> on the element to the truthiness of the expression <code>isDelightful</code>.</p>
|
||||
|
||||
<p>根据<code>isDelightful</code>表达式的结果是否为真,决定CSS类<code>extra-sparkle</code>是否出现在当前元素上。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -190,7 +236,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds style property <code>width</code> to the result of expression <code>mySize</code> in pixels. Units are optional.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds style property <code>width</code> to the result of expression <code>mySize</code> in pixels. Units are optional.</p>
|
||||
|
||||
<p>把CSS样式属性<code>width</code>的px(像素)值绑定到表达式<code>mySize</code>的结果。单位是可选的。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -202,7 +252,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Calls method <code>readRainbow</code> when a click event is triggered on this button element (or its children) and passes in the event object.</p>
|
||||
<td>
|
||||
|
||||
<p>Calls method <code>readRainbow</code> when a click event is triggered on this button element (or its children) and passes in the event object.</p>
|
||||
|
||||
<p>当这个按钮元素(及其子元素)上的click事件触发时,调用方法<code>readRainbow</code>,并把这个事件对象作为参数传进去。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -214,9 +268,13 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds a property to an interpolated string, for example, "Hello Seabiscuit". Equivalent to:
|
||||
<td>
|
||||
|
||||
<p>Binds a property to an interpolated string, for example, "Hello Seabiscuit". Equivalent to:
|
||||
<code><div [title]="'Hello ' + ponyName"></code></p>
|
||||
|
||||
<p>把一个属性绑定到插值字符串(如"Hello Seabiscuit")。这种写法等价于<code><div [title]="'Hello ' + ponyName"></code></p>
|
||||
|
||||
</td>
|
||||
|
||||
</tr><tr>
|
||||
|
@ -227,7 +285,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds text content to an interpolated string, for example, "Hello Seabiscuit".</p>
|
||||
<td>
|
||||
|
||||
<p>Binds text content to an interpolated string, for example, "Hello Seabiscuit".</p>
|
||||
|
||||
<p>把文本内容绑定到插值字符串(如"Hello Seabiscuit")</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -239,7 +301,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Sets up two-way data binding. Equivalent to: <code><my-cmp [title]="name" (titleChange)="name=$event"></code></p>
|
||||
<td>
|
||||
|
||||
<p>Sets up two-way data binding. Equivalent to: <code><my-cmp [title]="name" (titleChange)="name=$event"></code></p>
|
||||
|
||||
<p>设置双向绑定。等价于<code><my-cmp [title]="name" (titleChange)="name=$event"></code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -251,7 +317,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Creates a local variable <code>movieplayer</code> that provides access to the <code>video</code> element instance in data-binding and event-binding expressions in the current template.</p>
|
||||
<td>
|
||||
|
||||
<p>Creates a local variable <code>movieplayer</code> that provides access to the <code>video</code> element instance in data-binding and event-binding expressions in the current template.</p>
|
||||
|
||||
<p>创建一个局部变量<code>movieplayer</code>,支持在当前模板的数据绑定和事件绑定表达式中访问<code>video</code>元素的实例。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -263,7 +333,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>The <code>*</code> symbol turns the current element into an embedded template. Equivalent to:
|
||||
<td>
|
||||
|
||||
<p>The <code>*</code> symbol turns the current element into an embedded template. Equivalent to:
|
||||
<code><ng-template [myUnless]="myExpression"><p>...</p></ng-template></code></p>
|
||||
|
||||
</td>
|
||||
|
@ -276,7 +348,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Transforms the current value of expression <code>cardNumber</code> via the pipe called <code>myCardNumberFormatter</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Transforms the current value of expression <code>cardNumber</code> via the pipe called <code>myCardNumberFormatter</code>.</p>
|
||||
|
||||
<p>使用名叫<code>myCardNumberFormatter</code>的管道对表达式<code>cardNumber</code>的当前值进行变幻</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -288,7 +364,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>The safe navigation operator (<code>?</code>) means that the <code>employer</code> field is optional and if <code>undefined</code>, the rest of the expression should be ignored.</p>
|
||||
<td>
|
||||
|
||||
<p>The safe navigation operator (<code>?</code>) means that the <code>employer</code> field is optional and if <code>undefined</code>, the rest of the expression should be ignored.</p>
|
||||
|
||||
<p>安全导航操作符(<code>?</code>)表示<code>employer</code>字段是可选的,如果它是 <code>undefined</code> ,那么表达式其余的部分就会被忽略,并返回 <code>undefined</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -300,7 +380,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An SVG snippet template needs an <code>svg:</code> prefix on its root element to disambiguate the SVG element from an HTML component.</p>
|
||||
<td>
|
||||
|
||||
<p>An SVG snippet template needs an <code>svg:</code> prefix on its root element to disambiguate the SVG element from an HTML component.</p>
|
||||
|
||||
<p>模板中的 SVG 片段需要给它的根元素加上<code>svg:</code>前缀,以便把 SVG 元素和 HTML 元素区分开。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -312,7 +396,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An <code><svg></code> root element is detected as an SVG element automatically, without the prefix.</p>
|
||||
<td>
|
||||
|
||||
<p>An <code><svg></code> root element is detected as an SVG element automatically, without the prefix.</p>
|
||||
|
||||
<p>以<code><svg></code>作为根元素时会自动识别为 SVG 元素,不需要前缀。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -329,7 +417,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { CommonModule } from '@angular/common';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { CommonModule } from '@angular/common';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -345,7 +435,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Removes or recreates a portion of the DOM tree based on the <code>showSection</code> expression.</p>
|
||||
<td>
|
||||
|
||||
<p>Removes or recreates a portion of the DOM tree based on the <code>showSection</code> expression.</p>
|
||||
|
||||
<p>根据<code>showSection</code>表达式的结果,移除或重新创建 DOM 树的一部分。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -357,7 +451,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Turns the li element and its contents into a template, and uses that to instantiate a view for each item in list.</p>
|
||||
<td>
|
||||
|
||||
<p>Turns the li element and its contents into a template, and uses that to instantiate a view for each item in list.</p>
|
||||
|
||||
<p>把li元素及其内容变成一个模板,并使用这个模板为列表中的每一个条目实例化一个视图。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -369,7 +467,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Conditionally swaps the contents of the div by selecting one of the embedded templates based on the current value of <code>conditionExpression</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Conditionally swaps the contents of the div by selecting one of the embedded templates based on the current value of <code>conditionExpression</code>.</p>
|
||||
|
||||
<p>根据<code>conditionExpression</code>的当前值选择一个嵌入式模板,并用它替换这个 div 的内容。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -381,7 +483,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the presence of CSS classes on the element to the truthiness of the associated map values. The right-hand expression should return {class-name: true/false} map.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the presence of CSS classes on the element to the truthiness of the associated map values. The right-hand expression should return {class-name: true/false} map.</p>
|
||||
|
||||
<p>根据 map 中的 value 是否为真,来决定该元素上是否出现与 name 对应的 CSS 类。右侧的表达式应该返回一个形如 <code>{class-name: true/false}</code> 的 map。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -395,7 +501,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Allows you to assign styles to an HTML element using CSS. You can use CSS directly, as in the first example, or you can call a method from the component.</p>
|
||||
<td>
|
||||
|
||||
<p>Allows you to assign styles to an HTML element using CSS. You can use CSS directly, as in the first example, or you can call a method from the component.</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -412,7 +520,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { FormsModule } from '@angular/forms';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { FormsModule } from '@angular/forms';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -428,7 +538,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Provides two-way data-binding, parsing, and validation for form controls.</p>
|
||||
<td>
|
||||
|
||||
<p>Provides two-way data-binding, parsing, and validation for form controls.</p>
|
||||
|
||||
<p>为表单控件提供双向数据绑定、解析和验证功能。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -445,7 +559,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { Directive, ... } from '@angular/core';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { Directive, ... } from '@angular/core';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -461,7 +577,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares that a class is a component and provides metadata about the component.</p>
|
||||
<td>
|
||||
|
||||
<p>Declares that a class is a component and provides metadata about the component.</p>
|
||||
|
||||
<p>声明一个类是组件,并提供该组件的元数据。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -473,7 +593,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares that a class is a directive and provides metadata about the directive.</p>
|
||||
<td>
|
||||
|
||||
<p>Declares that a class is a directive and provides metadata about the directive.</p>
|
||||
|
||||
<p>声明一个类是指令,并提供该指令的元数据。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -485,7 +609,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares that a class is a pipe and provides metadata about the pipe.</p>
|
||||
<td>
|
||||
|
||||
<p>Declares that a class is a pipe and provides metadata about the pipe.</p>
|
||||
|
||||
<p>声明一个类是管道,并提供该管道的元数据。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -497,7 +625,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares that a class has dependencies that should be injected into the constructor when the dependency injector is creating an instance of this class.
|
||||
<td>
|
||||
|
||||
<p>Declares that a class has dependencies that should be injected into the constructor when the dependency injector is creating an instance of this class.
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -516,7 +646,9 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>@Directive({ property1: value1, ... })</code>
|
||||
<th>
|
||||
|
||||
<p><code>@Directive({ property1: value1, ... })</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -532,11 +664,17 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Specifies a CSS selector that identifies this directive within a template. Supported selectors include <code>element</code>,
|
||||
<td>
|
||||
|
||||
<p>Specifies a CSS selector that identifies this directive within a template. Supported selectors include <code>element</code>,
|
||||
<code>[attribute]</code>, <code>.class</code>, and <code>:not()</code>.</p>
|
||||
|
||||
<p>指定一个 CSS 选择器,用于在模板中标记出该指令。支持的选择器类型包括:<code>元素名</code>、<code>[属性名]</code>, <code>.类名</code> 和 <code>:not()</code>。</p>
|
||||
|
||||
<p>Does not support parent-child relationship selectors.</p>
|
||||
|
||||
<p>但不支持指定父子关系的选择器。</p>
|
||||
|
||||
</td>
|
||||
|
||||
</tr><tr>
|
||||
|
@ -547,7 +685,11 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of dependency injection providers for this directive and its children.</p>
|
||||
<td>
|
||||
|
||||
<p>List of dependency injection providers for this directive and its children.</p>
|
||||
|
||||
<p>该指令及其子指令的依赖注入提供商列表。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -564,7 +706,10 @@ is available to <code>declarations</code> of this module.</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p>
|
||||
<th>
|
||||
|
||||
<p>
|
||||
|
||||
<code>@Component</code> extends <code>@Directive</code>,
|
||||
so the <code>@Directive</code> configuration applies to components as well</p>
|
||||
|
||||
|
@ -580,7 +725,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>If set, the <code>templateUrl</code> and <code>styleUrl</code> are resolved relative to the component.</p>
|
||||
<td>
|
||||
|
||||
<p>If set, the <code>templateUrl</code> and <code>styleUrl</code> are resolved relative to the component.</p>
|
||||
|
||||
<p>如果设置了,那么 <code>templateUrl</code> 和 <code>styleUrl</code> 的路径就会相对于当前组件进行解析。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -592,7 +741,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of dependency injection providers scoped to this component's view.</p>
|
||||
<td>
|
||||
|
||||
<p>List of dependency injection providers scoped to this component's view.</p>
|
||||
|
||||
<p>依赖注入提供商列表,但它们的范围被限定为当前组件的视图。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -604,7 +757,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Inline template or external template URL of the component's view.</p>
|
||||
<td>
|
||||
|
||||
<p>Inline template or external template URL of the component's view.</p>
|
||||
|
||||
<p>当前组件视图的内联模板或外部模板的 URL 。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -616,7 +773,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>List of inline CSS styles or external stylesheet URLs for styling the component’s view.</p>
|
||||
<td>
|
||||
|
||||
<p>List of inline CSS styles or external stylesheet URLs for styling the component’s view.</p>
|
||||
|
||||
<p>用于为当前组件的视图提供样式的内联 CSS 或外部样式表 URL 的列表。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -633,7 +794,9 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { Input, ... } from '@angular/core';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { Input, ... } from '@angular/core';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -649,9 +812,13 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares an input property that you can update via property binding (example:
|
||||
<td>
|
||||
|
||||
<p>Declares an input property that you can update via property binding (example:
|
||||
<code><my-cmp [myProperty]="someExpression"></code>).</p>
|
||||
|
||||
<p>声明一个输入属性,你可以通过属性绑定来更新它,如 <code><my-cmp [myProperty]="someExpression"></code>。 </p>
|
||||
|
||||
</td>
|
||||
|
||||
</tr><tr>
|
||||
|
@ -662,7 +829,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Declares an output property that fires events that you can subscribe to with an event binding (example: <code><my-cmp (myEvent)="doSomething()"></code>).</p>
|
||||
<td>
|
||||
|
||||
<p>Declares an output property that fires events that you can subscribe to with an event binding (example: <code><my-cmp (myEvent)="doSomething()"></code>).</p>
|
||||
|
||||
<p>声明一个输出属性,它发出事件,你可以用事件绑定来订阅它们(如:<code><my-cmp (myEvent)="doSomething()"></code>)。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -674,7 +845,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds a host element property (here, the CSS class <code>valid</code>) to a directive/component property (<code>isValid</code>).</p>
|
||||
<td>
|
||||
|
||||
<p>Binds a host element property (here, the CSS class <code>valid</code>) to a directive/component property (<code>isValid</code>).</p>
|
||||
|
||||
<p>把宿主元素的一个属性(这里是 CSS 类 <code>valid</code>)绑定到指令或组件上的 <code>isValid</code> 属性。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -686,7 +861,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Subscribes to a host element event (<code>click</code>) with a directive/component method (<code>onClick</code>), optionally passing an argument (<code>$event</code>).</p>
|
||||
<td>
|
||||
|
||||
<p>Subscribes to a host element event (<code>click</code>) with a directive/component method (<code>onClick</code>), optionally passing an argument (<code>$event</code>).</p>
|
||||
|
||||
<p>用指令或组件上的<code>onClick</code>方法订阅宿主元素上的<code>click</code>事件,并从中获取<code>$event</code>参数(可选)</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -698,7 +877,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the first result of the component content query (<code>myPredicate</code>) to a property (<code>myChildComponent</code>) of the class.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the first result of the component content query (<code>myPredicate</code>) to a property (<code>myChildComponent</code>) of the class.</p>
|
||||
|
||||
<p>把组件内容查询(<code>myPredicate</code>)的第一个结果绑定到该类的 <code>myChildComponent</code> 属性上。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -710,7 +893,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the results of the component content query (<code>myPredicate</code>) to a property (<code>myChildComponents</code>) of the class.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the results of the component content query (<code>myPredicate</code>) to a property (<code>myChildComponents</code>) of the class.</p>
|
||||
|
||||
<p>把组件内容查询(<code>myPredicate</code>)的全部结果绑定到该类的 <code>myChildComponents</code> 属性上</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -722,7 +909,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the first result of the component view query (<code>myPredicate</code>) to a property (<code>myChildComponent</code>) of the class. Not available for directives.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the first result of the component view query (<code>myPredicate</code>) to a property (<code>myChildComponent</code>) of the class. Not available for directives.</p>
|
||||
|
||||
<p>把组件视图查询(<code>myPredicate</code>)的第一个结果绑定到该类的 <code>myChildComponent</code> 属性上。对指令无效。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -734,7 +925,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Binds the results of the component view query (<code>myPredicate</code>) to a property (<code>myChildComponents</code>) of the class. Not available for directives.</p>
|
||||
<td>
|
||||
|
||||
<p>Binds the results of the component view query (<code>myPredicate</code>) to a property (<code>myChildComponents</code>) of the class. Not available for directives.</p>
|
||||
|
||||
<p>把组件视图查询(<code>myPredicate</code>)的全部结果绑定到该类的 <code>myChildComponents</code> 属性上。对指令无效。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -751,7 +946,9 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p>(implemented as class methods)
|
||||
<th>
|
||||
|
||||
<p>(implemented as class methods)
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -767,7 +964,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.</p>
|
||||
<td>
|
||||
|
||||
<p>Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.</p>
|
||||
|
||||
<p>在任何其它生命周期钩子之前调用。可以用它来注入依赖项,但不要在这里做正事。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -779,7 +980,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after every change to input properties and before processing content or child views.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after every change to input properties and before processing content or child views.</p>
|
||||
|
||||
<p>每当输入属性发生变化时就会调用,但位于处理内容(<code>ng-content</code>)或子视图之前。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -791,7 +996,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after the constructor, initializing input properties, and the first call to <code>ngOnChanges</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after the constructor, initializing input properties, and the first call to <code>ngOnChanges</code>.</p>
|
||||
|
||||
<p>在调用完构造函数、初始化完所有输入属性并首次调用过<code>ngOnChanges</code>之后调用。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -803,7 +1012,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.</p>
|
||||
<td>
|
||||
|
||||
<p>Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.</p>
|
||||
|
||||
<p>每当对组件或指令的输入属性进行变更检测时就会调用。可以用它来扩展变更检测逻辑,执行自定义的检测逻辑。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -815,7 +1028,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after <code>ngOnInit</code> when the component's or directive's content has been initialized.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after <code>ngOnInit</code> when the component's or directive's content has been initialized.</p>
|
||||
|
||||
<p><code>ngOnInit</code>完成之后,当组件或指令的内容(<code>ng-content</code>)已经初始化完毕时调用。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -827,7 +1044,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after every check of the component's or directive's content.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after every check of the component's or directive's content.</p>
|
||||
|
||||
<p>每当组件或指令的内容(<code>ng-content</code>)做变更检测时调用。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -839,7 +1060,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after <code>ngAfterContentInit</code> when the component's view has been initialized. Applies to components only.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after <code>ngAfterContentInit</code> when the component's view has been initialized. Applies to components only.</p>
|
||||
|
||||
<p>当<code>ngAfterContentInit</code>完毕,并且组件的视图已经初始化完毕时调用。只适用于组件。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -851,7 +1076,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called after every check of the component's view. Applies to components only.</p>
|
||||
<td>
|
||||
|
||||
<p>Called after every check of the component's view. Applies to components only.</p>
|
||||
|
||||
<p>当组件视图每次执行变更检测时调用。只适用于组件。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -863,7 +1092,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Called once, before the instance is destroyed.</p>
|
||||
<td>
|
||||
|
||||
<p>Called once, before the instance is destroyed.</p>
|
||||
|
||||
<p>只在实例被销毁前调用一次。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -894,7 +1127,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Sets or overrides the provider for <code>MyService</code> to the <code>MyMockService</code> class.</p>
|
||||
<td>
|
||||
|
||||
<p>Sets or overrides the provider for <code>MyService</code> to the <code>MyMockService</code> class.</p>
|
||||
|
||||
<p>把 <code>MyService</code> 的服务提供商设置或改写为 <code>MyMockService</code> 类。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -906,7 +1143,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Sets or overrides the provider for <code>MyService</code> to the <code>myFactory</code> factory function.</p>
|
||||
<td>
|
||||
|
||||
<p>Sets or overrides the provider for <code>MyService</code> to the <code>myFactory</code> factory function.</p>
|
||||
|
||||
<p>把 <code>MyService</code> 的服务提供商设置或改写为 <code>myFactory</code> 工厂函数。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -918,7 +1159,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Sets or overrides the provider for <code>MyValue</code> to the value <code>41</code>.</p>
|
||||
<td>
|
||||
|
||||
<p>Sets or overrides the provider for <code>MyValue</code> to the value <code>41</code>.</p>
|
||||
|
||||
<p>把 <code>MyValue</code> 的服务提供商改写为一个特定的值 <code>41</code> 。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -935,7 +1180,9 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</th>
|
||||
|
||||
<th><p><code>import { Routes, RouterModule, ... } from '@angular/router';</code>
|
||||
<th>
|
||||
|
||||
<p><code>import { Routes, RouterModule, ... } from '@angular/router';</code>
|
||||
|
||||
</p>
|
||||
|
||||
|
@ -951,7 +1198,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Configures routes for the application. Supports static, parameterized, redirect, and wildcard routes. Also supports custom route data and resolve.</p>
|
||||
<td>
|
||||
|
||||
<p>Configures routes for the application. Supports static, parameterized, redirect, and wildcard routes. Also supports custom route data and resolve.</p>
|
||||
|
||||
<p>为该应用配置路由。支持静态、参数化、重定向和通配符路由。也支持自定义路由数据和解析(resolve)函数。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -963,7 +1214,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Marks the location to load the component of the active route.</p>
|
||||
<td>
|
||||
|
||||
<p>Marks the location to load the component of the active route.</p>
|
||||
|
||||
<p>标记出一个位置,用来加载活动路由的组件。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -975,7 +1230,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>Creates a link to a different view based on a route instruction consisting of a route path, required and optional parameters, query parameters, and a fragment. To navigate to a root route, use the <code>/</code> prefix; for a child route, use the <code>./</code>prefix; for a sibling or parent, use the <code>../</code> prefix.</p>
|
||||
<td>
|
||||
|
||||
<p>Creates a link to a different view based on a route instruction consisting of a route path, required and optional parameters, query parameters, and a fragment. To navigate to a root route, use the <code>/</code> prefix; for a child route, use the <code>./</code>prefix; for a sibling or parent, use the <code>../</code> prefix.</p>
|
||||
|
||||
<p>使用路由体系创建一个到其它视图的链接。路由体系由路由路径、必要参数、可选参数、查询参数和文档片段组成。要导航到根路由,请使用<code>/</code>前缀;要导航到子路由,使用<code>./</code>前缀;要导航到兄弟路由或父级路由,使用<code>../</code>前缀。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -987,7 +1246,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>The provided classes are added to the element when the <code>routerLink</code> becomes the current active route.</p>
|
||||
<td>
|
||||
|
||||
<p>The provided classes are added to the element when the <code>routerLink</code> becomes the current active route.</p>
|
||||
|
||||
<p>当 <code>routerLink</code> 指向的路由变成活动路由时,为当前元素添加一些类(比如这里的 <code>active</code>)。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -999,7 +1262,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An interface for defining a class that the router should call first to determine if it should activate this component. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
<td>
|
||||
|
||||
<p>An interface for defining a class that the router should call first to determine if it should activate this component. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
|
||||
<p>用来定义类的接口。路由器会首先调用本接口来决定是否激活该路由。应该返回一个 <code>boolean</code> 或能解析成 <code>boolean</code> 的 <code>Observable/Promise</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -1011,7 +1278,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An interface for defining a class that the router should call first to determine if it should deactivate this component after a navigation. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
<td>
|
||||
|
||||
<p>An interface for defining a class that the router should call first to determine if it should deactivate this component after a navigation. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
|
||||
<p>用来定义类的接口。路由器会在导航离开前首先调用本接口以决定是否取消激活本路由。应该返回一个 <code>boolean</code> 或能解析成 <code>boolean</code> 的 <code>Observable/Promise</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -1023,7 +1294,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An interface for defining a class that the router should call first to determine if it should activate the child route. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
<td>
|
||||
|
||||
<p>An interface for defining a class that the router should call first to determine if it should activate the child route. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
|
||||
<p>用来定义类的接口。路由器会首先调用本接口来决定是否激活一个子路由。应该返回一个 <code>boolean</code> 或能解析成 <code>boolean</code> 的 <code>Observable/Promise</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -1035,7 +1310,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An interface for defining a class that the router should call first to resolve route data before rendering the route. Should return a value or an Observable/Promise that resolves to a value.</p>
|
||||
<td>
|
||||
|
||||
<p>An interface for defining a class that the router should call first to resolve route data before rendering the route. Should return a value or an Observable/Promise that resolves to a value.</p>
|
||||
|
||||
<p>用来定义类的接口。路由器会在渲染该路由之前,首先调用它来解析路由数据。应该返回一个值或能解析成值的 <code>Observable/Promise</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -1047,7 +1326,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
|
|||
|
||||
</td>
|
||||
|
||||
<td><p>An interface for defining a class that the router should call first to check if the lazy loaded module should be loaded. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
<td>
|
||||
|
||||
<p>An interface for defining a class that the router should call first to check if the lazy loaded module should be loaded. Should return a boolean or an Observable/Promise that resolves to a boolean.</p>
|
||||
|
||||
<p>用来定义类的接口。路由器会首先调用它来决定是否应该加载一个惰性加载模块。应该返回一个 <code>boolean</code> 或能解析成 <code>boolean</code> 的 <code>Observable/Promise</code>。</p>
|
||||
|
||||
</td>
|
||||
|
||||
|
|
|
@ -69,6 +69,8 @@ sub.unsubscribe();
|
|||
|
||||
### Error handling
|
||||
|
||||
### 错误处理
|
||||
|
||||
* Observable execution errors are delivered to the subscriber's error handler, and the subscriber automatically unsubscribes from the observable.
|
||||
|
||||
<code-example hideCopy>
|
||||
|
@ -259,7 +261,7 @@ let subscription = clicks$
|
|||
// Stop listening
|
||||
subscription.unsubscribe();</pre>
|
||||
|
||||
</td>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
|
@ -273,7 +275,7 @@ button.addEventListener(‘click’, handler);
|
|||
button.removeEventListener(‘click’, handler);
|
||||
</pre>
|
||||
|
||||
</td>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
|
@ -311,14 +313,18 @@ button.removeEventListener(‘click’, handler);
|
|||
|
||||
</td>
|
||||
|
||||
<td>Listen for keystrokes, but provide a stream representing the value in the input.
|
||||
<td>
|
||||
|
||||
Listen for keystrokes, but provide a stream representing the value in the input.
|
||||
<pre>fromEvent(inputEl, 'keydown').pipe(
|
||||
map(e => e.target.value)
|
||||
);</pre>
|
||||
|
||||
</td>
|
||||
|
||||
<td>Does not support configuration.
|
||||
<td>
|
||||
|
||||
Does not support configuration.
|
||||
<pre>element.addEventListener(eventName, (event) => {
|
||||
// Cannot change the passed Event into another
|
||||
// value before it gets to the handler
|
||||
|
|
|
@ -82,7 +82,7 @@ The running application displays three heroes:
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
E2E test that all children were instantiated and displayed as expected:
|
||||
|
||||
|
@ -129,7 +129,7 @@ Here's the `NameParentComponent` demonstrating name variations including a name
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
E2E tests of input property setter with empty and non-empty names:
|
||||
|
||||
|
@ -191,7 +191,7 @@ Here's the output of a button-pushing sequence:
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
Test that ***both*** input properties are set initially and that button clicks trigger
|
||||
the expected `ngOnChanges` calls and values:
|
||||
|
@ -251,7 +251,7 @@ and the method processes it:
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
Test that clicking the *Agree* and *Disagree* buttons update the appropriate counters:
|
||||
|
||||
|
@ -325,7 +325,7 @@ Here we see the parent and child working together.
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
Test that the seconds displayed in the parent template
|
||||
match the seconds displayed in the child's status message.
|
||||
|
@ -431,7 +431,7 @@ that it takes future values from the timer component.
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
Use [the same countdown timer tests](guide/component-interaction#countdown-tests) as before.
|
||||
|
||||
|
@ -512,7 +512,7 @@ facilitated by the service:
|
|||
|
||||
<h3 class="no-toc">Test it</h3>
|
||||
|
||||
<h3 class="no-toc">测试一下</h3>
|
||||
<h3 class="no-toc">测试一下!</h3>
|
||||
|
||||
Tests click buttons of both the parent `MissionControlComponent` and the `AstronautComponent` children
|
||||
and verify that the history meets expectations:
|
||||
|
|
|
@ -12,7 +12,7 @@ This cookbook explores many of the features of Dependency Injection (DI) in Angu
|
|||
See the <live-example name="dependency-injection-in-action"></live-example>
|
||||
of the code in this cookbook.
|
||||
|
||||
到<live-example name="dependency-injection-in-action"></live-example>查看本烹饪书的源码。
|
||||
要获取本“烹饪宝典”的代码,**参见<live-example name="dependency-injection-in-action"></live-example>**。
|
||||
|
||||
{@a app-wide-dependencies}
|
||||
|
||||
|
|
|
@ -124,11 +124,7 @@ All section heading text should be in "Sentence case", which means the first wor
|
|||
|
||||
**Always follow the section heading with at least one blank line.**
|
||||
|
||||
<h2 class="no-toc">
|
||||
|
||||
Main section heading
|
||||
|
||||
</h2>
|
||||
<h2 class="no-toc">Main section heading</h2>
|
||||
|
||||
There are usually one or more main sections that may be further divided into secondary sections.
|
||||
|
||||
|
@ -144,11 +140,7 @@ The main section heading should be followed by a blank line and then the content
|
|||
|
||||
```
|
||||
|
||||
<h3 class="no-toc">
|
||||
|
||||
Secondary section heading
|
||||
|
||||
</h3>
|
||||
<h3 class="no-toc">Secondary section heading</h3>
|
||||
|
||||
A secondary section heading is related to a main heading and _falls textually within_ the bounds of that main heading.
|
||||
|
||||
|
@ -218,11 +210,7 @@ To exclude a heading from the TOC, create the heading as an `<h2>` or `<h3>` ele
|
|||
|
||||
```html
|
||||
|
||||
<h3 class="no-toc">
|
||||
|
||||
This heading is not displayed in the TOC
|
||||
|
||||
</h3>
|
||||
<h3 class="no-toc">This heading is not displayed in the TOC</h3>
|
||||
|
||||
```
|
||||
|
||||
|
@ -230,11 +218,7 @@ You can turn off TOC generation for the _entire_ page by writing the title with
|
|||
|
||||
```html
|
||||
|
||||
<h1 class="no-toc">
|
||||
|
||||
A guide without a TOC
|
||||
|
||||
</h1>
|
||||
<h1 class="no-toc">A guide without a TOC</h1>
|
||||
|
||||
```
|
||||
|
||||
|
@ -803,6 +787,8 @@ Remember to exclude these files from stackblitz by listing them in the `stackbli
|
|||
|
||||
## Live examples
|
||||
|
||||
## 在线例子
|
||||
|
||||
By adding `<live-example>` to the page you generate links that run sample code in the Stackblitz live coding environment and download that code to the reader's file system.
|
||||
|
||||
Live examples (AKA "stackblitz") are defined by one or more `stackblitz.json` files in the root of a code sample folder. Each sample folder usually has a single unnamed definition file, the default `stackblitz.json`.
|
||||
|
@ -1309,6 +1295,8 @@ Use HTML tables to present tabular data.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -1331,6 +1319,8 @@ Use HTML tables to present tabular data.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<!-- can use markdown too; remember blank lines -->
|
||||
|
@ -1355,6 +1345,8 @@ Use HTML tables to present tabular data.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -1411,6 +1403,8 @@ Here is the markup for this table.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -1433,6 +1427,8 @@ Here is the markup for this table.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<!-- can use markdown too; remember blank lines -->
|
||||
|
@ -1457,6 +1453,8 @@ Here is the markup for this table.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
|
|
@ -782,6 +782,8 @@ You rarely access Angular feature modules directly. You usually import them from
|
|||
|
||||
## NgModule
|
||||
|
||||
## 可观察对象 (observable)
|
||||
|
||||
Helps you organize an application into cohesive blocks of functionality.
|
||||
An NgModule identifies the components, directives, and pipes that the application uses along with the list of external NgModules that the application needs, such as `FormsModule`.
|
||||
|
||||
|
@ -957,7 +959,7 @@ For more information, see the [Routing & Navigation](guide/router) page.
|
|||
|
||||
## Router module
|
||||
|
||||
## 路由器模块
|
||||
## 路由器模块 (router module)
|
||||
|
||||
A separate [NgModule](guide/glossary#ngmodule) that provides the necessary service providers and directives for navigating through application views.
|
||||
|
||||
|
|
|
@ -450,9 +450,6 @@ You can think of these observables as _blueprints_ for actual HTTP requests.
|
|||
In fact, each `subscribe()` initiates a separate, independent execution of the observable.
|
||||
Subscribing twice results in two HTTP requests.
|
||||
|
||||
*注意这个`subscribe()`方法*。 所有从`HttpClient`返回的可观察对象都是*冷的(cold)*,也就是说,它们只是发起请求的*蓝图*而已。在我们调用`subscribe()`之前,什么都不会发生,而当我们每次调用`subscribe()`时,就会独立发起一次请求。
|
||||
比如,下列代码会使用同样的数据发送两次同样的 POST 请求:
|
||||
|
||||
```javascript
|
||||
|
||||
const req = http.get<Heroes>('/api/heroes');
|
||||
|
@ -483,6 +480,8 @@ in order to initiate the request.
|
|||
|
||||
## Advanced usage
|
||||
|
||||
## 高级用法
|
||||
|
||||
The above sections detail how to use the basic HTTP functionality in `@angular/common/http`, but sometimes you need to do more than make simple requests and get data back.
|
||||
|
||||
### Configuring the request
|
||||
|
@ -793,8 +792,6 @@ If you set the cloned request body to `undefined`, Angular assumes you intend to
|
|||
That is not what you want.
|
||||
If you set the cloned request body to `null`, Angular knows you intend to clear the request body.
|
||||
|
||||
这种克隆一个请求并设置一组新的请求头的操作非常常见,因此有了一种快捷写法:
|
||||
|
||||
```javascript
|
||||
|
||||
newReq = req.clone({ ... }); // body not mentioned => preserve original body
|
||||
|
@ -963,8 +960,6 @@ the cached response first (and immediately), followed later
|
|||
by the response from the server.
|
||||
Subscribers see a sequence of _two_ responses.
|
||||
|
||||
现在,如果 URL 被缓存过,那么任何人调用`http.get(url)`时都会收到*两次*响应。
|
||||
|
||||
### Listening to progress events
|
||||
|
||||
### 监听进度事件
|
||||
|
@ -1105,7 +1100,7 @@ There are also tests of an application data service that call `HttpClient` in
|
|||
|
||||
### Setup
|
||||
|
||||
### 初始设置
|
||||
### 环境设置
|
||||
|
||||
To begin testing calls to `HttpClient`,
|
||||
import the `HttpClientTestingModule` and the mocking controller, `HttpTestingController`,
|
||||
|
@ -1150,6 +1145,8 @@ Now you can write a test that expects a GET Request to occur and provides a mock
|
|||
|
||||
The last step, verifying that no requests remain outstanding, is common enough for you to move it into an `afterEach()` step:
|
||||
|
||||
最后一步,验证没有发起过预期之外的请求,足够通用,因此我们可以把它移到`afterEach()`中:
|
||||
|
||||
<code-example
|
||||
path="http/src/testing/http-client.spec.ts"
|
||||
region="afterEach"
|
||||
|
|
|
@ -344,7 +344,7 @@ Here's a brief description of each exercise:
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
|
|
@ -38,12 +38,16 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Feature Module
|
||||
|
||||
特性模块
|
||||
|
||||
</th>
|
||||
|
||||
<th style="vertical-align: top">
|
||||
|
||||
Guidelines
|
||||
|
||||
指导原则
|
||||
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
|
@ -54,6 +58,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Domain
|
||||
|
||||
领域
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -70,6 +76,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
They might be imported by the root `AppModule` of a small application that lacks routing.
|
||||
|
||||
对于缺少路由的小型应用,它们可能只会被根模块`AppModule`导入一次。
|
||||
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
@ -80,6 +88,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Routed
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -88,6 +98,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
All lazy-loaded modules are routed feature modules by definition.
|
||||
|
||||
根据这个定义,所有惰性加载的模块都是路由特性模块。
|
||||
|
||||
Routed feature modules don’t export anything because their components never appear in the template of an external component.
|
||||
|
||||
A lazy-loaded routed feature module should not be imported by any module. Doing so would trigger an eager load, defeating the purpose of lazy loading.That means you won’t see them mentioned among the `AppModule` imports. An eager loaded routed feature module must be imported by another module so that the compiler learns about its components.
|
||||
|
@ -104,6 +116,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -112,6 +126,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
A routing module typically does the following:
|
||||
|
||||
路由模块通常会做这些:
|
||||
|
||||
<ul>
|
||||
|
||||
<li>
|
||||
|
@ -164,6 +180,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Service
|
||||
|
||||
服务
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -182,6 +200,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Widget
|
||||
|
||||
窗口部件
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -194,6 +214,8 @@ typical characteristics, in real world apps, you may see hybrids.
|
|||
|
||||
Import widget modules in any module whose component templates need the widgets.
|
||||
|
||||
如果任何模块的组件模板中需要用到这些窗口部件,就请导入相应的窗口部件模块。
|
||||
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
@ -210,24 +232,32 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Feature Module
|
||||
|
||||
特性模块
|
||||
|
||||
</th>
|
||||
|
||||
<th style="vertical-align: top">
|
||||
|
||||
Declarations
|
||||
|
||||
声明`declarations`
|
||||
|
||||
</th>
|
||||
|
||||
<th style="vertical-align: top">
|
||||
|
||||
Providers
|
||||
|
||||
提供商`providers`
|
||||
|
||||
</th>
|
||||
|
||||
<th style="vertical-align: top">
|
||||
|
||||
Exports
|
||||
|
||||
导出什么
|
||||
|
||||
</th>
|
||||
|
||||
<th style="vertical-align: top">
|
||||
|
@ -244,24 +274,32 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Domain
|
||||
|
||||
领域
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Yes
|
||||
|
||||
有
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Rare
|
||||
|
||||
罕见
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Top component
|
||||
|
||||
顶级组件
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -278,24 +316,32 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Routed
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Yes
|
||||
|
||||
有
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Rare
|
||||
|
||||
罕见
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
No
|
||||
|
||||
无
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -312,12 +358,16 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Routing
|
||||
|
||||
路由
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
No
|
||||
|
||||
无
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -346,24 +396,32 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Service
|
||||
|
||||
服务
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
No
|
||||
|
||||
无
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Yes
|
||||
|
||||
有
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
No
|
||||
|
||||
无
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -380,24 +438,32 @@ The following table summarizes the key characteristics of each feature module gr
|
|||
|
||||
Widget
|
||||
|
||||
窗口部件
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Yes
|
||||
|
||||
有
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Rare
|
||||
|
||||
罕见
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
||||
Yes
|
||||
|
||||
有
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
|
|
@ -46,6 +46,8 @@ into three categories:
|
|||
|
||||
The following table summarizes the `@NgModule` metadata properties.
|
||||
|
||||
下面是`@NgModule`元数据中属性的汇总表:
|
||||
|
||||
<table>
|
||||
|
||||
<tr>
|
||||
|
@ -62,7 +64,7 @@ The following table summarizes the `@NgModule` metadata properties.
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
@ -130,6 +132,8 @@ The following table summarizes the `@NgModule` metadata properties.
|
|||
|
||||
A list of dependency-injection providers.
|
||||
|
||||
依赖注入提供商的列表。
|
||||
|
||||
Angular registers these providers with the NgModule's injector.
|
||||
If it is the NgModule used for bootstrapping then it is the root injector.
|
||||
|
||||
|
@ -231,9 +235,13 @@ The following table summarizes the `@NgModule` metadata properties.
|
|||
|
||||
Usually there's only one component in this list, the _root component_ of the application.
|
||||
|
||||
通常,在这个列表中只有一个组件,也就是应用的*根组件*。
|
||||
|
||||
Angular can launch with multiple bootstrap components,
|
||||
each with its own location in the host web page.
|
||||
|
||||
Angular也可以引导多个引导组件,它们每一个都在宿主页面中有自己的位置。
|
||||
|
||||
A bootstrap component is automatically added to `entryComponents`.
|
||||
|
||||
</td>
|
||||
|
|
|
@ -913,7 +913,7 @@ For more information, see [Entry Components](guide/entry-components).
|
|||
|
||||
## Why does Angular need _entryComponents_?
|
||||
|
||||
## 为什么 Angular 需要*入口组件*?
|
||||
## 为什么Angular需要*入口组件*?
|
||||
|
||||
The reason is _tree shaking_. For production apps you want to load the smallest, fastest code possible. The code should contain only the classes that you actually need.
|
||||
It should exclude a component that's never used, whether or not that component is declared.
|
||||
|
|
|
@ -65,6 +65,8 @@ The NgModule classes differ from JavaScript module in the following key ways:
|
|||
* An NgModule bounds [declarable classes](guide/ngmodule-faq#q-declarable) only.
|
||||
Declarables are the only classes that matter to the [Angular compiler](guide/ngmodule-faq#q-angular-compiler).
|
||||
|
||||
Angular模块只绑定了[_可声明的类_](guide/ngmodule-faq#q-declarable),这些可声明的类只是供[Angular编译器](guide/ngmodule-faq#q-angular-compiler)用的。
|
||||
|
||||
* Instead of defining all member classes in one giant file as in a JavaScript module,
|
||||
you list the module's classes in the `@NgModule.declarations` list.
|
||||
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
# NgModules
|
||||
|
||||
# Angular模块 (NgModule)
|
||||
|
||||
#### Prerequisites
|
||||
|
||||
A basic understanding of the following concepts:
|
||||
|
@ -26,6 +28,8 @@ section.
|
|||
|
||||
## Angular modularity
|
||||
|
||||
## Angular 模块化
|
||||
|
||||
Modules are a great way to organize an application and extend it with capabilities from external libraries.
|
||||
|
||||
Angular libraries are NgModules, such as `FormsModule`, `HttpClientModule`, and `RouterModule`.
|
||||
|
@ -38,6 +42,8 @@ NgModules consolidate components, directives, and pipes into
|
|||
cohesive blocks of functionality, each focused on a
|
||||
feature area, application business domain, workflow, or common collection of utilities.
|
||||
|
||||
Angular 模块把组件、指令和管道打包成内聚的功能块,每个模块聚焦于一个特性区域、业务领域、工作流或通用工具。
|
||||
|
||||
Modules can also add services to the application.
|
||||
Such services might be internally developed, like something you'd develop yourself or come from outside sources, such as the Angular router and HTTP client.
|
||||
|
||||
|
|
|
@ -582,7 +582,7 @@ display updates as you add heroes, even when you mutate the `heroes` array.
|
|||
|
||||
<h3 class="no-toc">The impure <i>AsyncPipe</i></h3>
|
||||
|
||||
<h3 class="no-toc">非纯管道 <i>AsyncPipe</i></h3>
|
||||
<h3 id='async-pipe'>非纯 <i>AsyncPipe</i></h3>
|
||||
|
||||
The Angular `AsyncPipe` is an interesting example of an impure pipe.
|
||||
The `AsyncPipe` accepts a `Promise` or `Observable` as input
|
||||
|
|
|
@ -29,13 +29,9 @@ And you can also <a href="generated/zips/cli-quickstart/cli-quickstart.zip" targ
|
|||
|
||||
你还可以 <a href="generated/zips/cli-quickstart/cli-quickstart.zip" target="_blank">下载这个例子。</a>
|
||||
|
||||
<h2 id='devenv'>
|
||||
<h2 id='devenv'>Step 1. Set up the Development Environment</h2>
|
||||
|
||||
Step 1. Set up the Development Environment
|
||||
|
||||
步骤1. 设置开发环境
|
||||
|
||||
</h2>
|
||||
<h2 id='devenv'>步骤1. 设置开发环境</h2>
|
||||
|
||||
You need to set up your development environment before you can do anything.
|
||||
|
||||
|
@ -68,13 +64,9 @@ Then **install the [Angular CLI](https://github.com/angular/angular-cli)** globa
|
|||
|
||||
</code-example>
|
||||
|
||||
<h2 id='create-proj'>
|
||||
<h2 id='create-proj'>Step 2. Create a new project</h2>
|
||||
|
||||
Step 2. Create a new project
|
||||
|
||||
步骤2. 创建新项目
|
||||
|
||||
</h2>
|
||||
<h2 id='create-proj'>步骤2. 创建新项目</h2>
|
||||
|
||||
Open a terminal window.
|
||||
|
||||
|
@ -100,13 +92,9 @@ It takes time to set up a new project; most of it is spent installing npm packag
|
|||
|
||||
</div>
|
||||
|
||||
<h2 id='serve'>
|
||||
<h2 id='serve'>Step 3: Serve the application</h2>
|
||||
|
||||
Step 3: Serve the application
|
||||
|
||||
步骤3. 启动开发服务器
|
||||
|
||||
</h2>
|
||||
<h2 id='serve'>步骤3. 启动开发服务器</h2>
|
||||
|
||||
Go to the project directory and launch the server.
|
||||
|
||||
|
@ -137,13 +125,9 @@ Your app greets you with a message:
|
|||
<img src='generated/images/guide/cli-quickstart/app-works.png' alt="The app works!">
|
||||
</figure>
|
||||
|
||||
<h2 id='first-component'>
|
||||
<h2 id='first-component'>Step 4: Edit your first Angular component</h2>
|
||||
|
||||
Step 4: Edit your first Angular component
|
||||
|
||||
步骤4. 编辑我们的第一个Angular组件
|
||||
|
||||
</h2>
|
||||
<h2 id='first-component'>步骤4. 编辑我们的第一个Angular组件</h2>
|
||||
|
||||
The CLI created the first Angular component for you.
|
||||
This is the _root component_ and it is named `app-root`.
|
||||
|
@ -641,7 +625,7 @@ These files go in the root folder next to `src/`.
|
|||
|
||||
Purpose
|
||||
|
||||
用途
|
||||
目的
|
||||
|
||||
</th>
|
||||
|
||||
|
|
|
@ -924,7 +924,7 @@ such as one of the following:
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
@ -998,8 +998,8 @@ such as one of the following:
|
|||
|
||||
`true` if the control user has not yet entered the HTML control
|
||||
and triggered its blur event. Its opposite is `myControl.touched`.
|
||||
|
||||
如果用户尚未进入这个HTML控件,也没有触发过它的`blur`(失去焦点)事件,则为`true`。
|
||||
|
||||
如果用户尚未进入这个HTML控件,也没有触发过它的`blur`(失去焦点)事件,则为`true`。
|
||||
它是`myControl.touched`的反义词。
|
||||
|
||||
</td>
|
||||
|
|
|
@ -309,7 +309,7 @@ It has a great deal of useful information including:
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
@ -538,7 +538,7 @@ During each navigation, the `Router` emits navigation events through the `Router
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
@ -725,7 +725,7 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>Router</code>
|
||||
|
||||
<code>路由器</code>
|
||||
<code>Router</code>(路由器)
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -746,6 +746,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>RouterModule</code>
|
||||
|
||||
<code>RouterModule</code>(路由器模块)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -765,7 +767,7 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>Routes</code>
|
||||
|
||||
<code>路由定义(数组)</code>
|
||||
<code>Routes</code>(路由数组)
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -785,7 +787,7 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>Route</code>
|
||||
|
||||
<code>路由器</code>
|
||||
<code>Route</code>(路由)
|
||||
|
||||
</td>
|
||||
|
||||
|
@ -806,6 +808,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>RouterOutlet</code>
|
||||
|
||||
<code>RouterOutlet</code>(路由出口)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -824,6 +828,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>RouterLink</code>
|
||||
|
||||
<code>RouterLink</code>(路由链接)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -842,6 +848,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>RouterLinkActive</code>
|
||||
|
||||
<code>RouterLinkActive</code>(活动路由链接)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -861,6 +869,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>ActivatedRoute</code>
|
||||
|
||||
<code>ActivatedRoute</code>(激活的路由)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -880,6 +890,8 @@ Here are the key `Router` terms and their meanings:
|
|||
|
||||
<code>RouterState</code>
|
||||
|
||||
<code>RouterState</code>(路由器状态)
|
||||
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
@ -2507,7 +2519,7 @@ to handle parameter access for both route parameters (`paramMap`) and query para
|
|||
|
||||
Description
|
||||
|
||||
描述
|
||||
说明
|
||||
|
||||
</th>
|
||||
|
||||
|
|
|
@ -17,13 +17,9 @@ You can run the <live-example></live-example> in Stackblitz and download the cod
|
|||
|
||||
运行<live-example></live-example>来试用本页的代码。
|
||||
|
||||
<h2 id='report-issues'>
|
||||
<h2 id='report-issues'>Reporting vulnerabilities</h2>
|
||||
|
||||
Reporting vulnerabilities
|
||||
|
||||
举报漏洞
|
||||
|
||||
</h2>
|
||||
<h2 id='report-issues'>举报漏洞</h2>
|
||||
|
||||
To report vulnerabilities in Angular itself, email us at [security@angular.io](mailto:security@angular.io).
|
||||
|
||||
|
@ -34,13 +30,9 @@ philosophy](https://www.google.com/about/appsecurity/).
|
|||
|
||||
要了解关于“谷歌如何处理安全问题”的更多信息,参见[谷歌的安全哲学](https://www.google.com/about/appsecurity/)。
|
||||
|
||||
<h2 id='best-practices'>
|
||||
<h2 id='best-practices'>Best practices</h2>
|
||||
|
||||
Best practices
|
||||
|
||||
最佳实践
|
||||
|
||||
</h2>
|
||||
<h2 id='best-practices'>最佳实践</h2>
|
||||
|
||||
* **Keep current with the latest Angular library releases.**
|
||||
We regularly update the Angular libraries, and these updates may fix security defects discovered in
|
||||
|
@ -64,13 +56,9 @@ For more information, see the [Trusting safe values](guide/security#bypass-secur
|
|||
**避免使用本文档中带“[_安全风险_](guide/security#bypass-security-apis)”标记的Angular API。**
|
||||
要了解更多信息,请参阅本章的[信任那些安全的值](guide/security#bypass-security-apis)部分。
|
||||
|
||||
<h2 id='xss'>
|
||||
<h2 id='xss'>Preventing cross-site scripting (XSS)</h2>
|
||||
|
||||
Preventing cross-site scripting (XSS)
|
||||
|
||||
防范跨站脚本(XSS)攻击
|
||||
|
||||
</h2>
|
||||
<h2 id='xss'>防范跨站脚本(XSS)攻击</h2>
|
||||
|
||||
[Cross-site scripting (XSS)](https://en.wikipedia.org/wiki/Cross-site_scripting) enables attackers
|
||||
to inject malicious code into web pages. Such code can then, for example, steal user data (in
|
||||
|
@ -247,13 +235,9 @@ carries a high risk of introducing template-injection vulnerabilities.
|
|||
务必使用一个能够自动进行无害化处理以防范XSS漏洞的后端模板语言。不要在服务器端使用模板语言生成Angular模板,
|
||||
这样会带来很高的“模板注入”风险。
|
||||
|
||||
<h2 id='bypass-security-apis'>
|
||||
<h2 id='bypass-security-apis'>Trusting safe values</h2>
|
||||
|
||||
Trusting safe values
|
||||
|
||||
信任安全值
|
||||
|
||||
</h2>
|
||||
<h2 id='bypass-security-apis'>信任安全值</h2>
|
||||
|
||||
Sometimes applications genuinely need to include executable code, display an `<iframe>` from some
|
||||
URL, or construct potentially dangerous URLs. To prevent automatic sanitization in any of these
|
||||
|
@ -324,13 +308,9 @@ Angular to allow binding into `<iframe src>`:
|
|||
|
||||
</code-example>
|
||||
|
||||
<h2 id='http'>
|
||||
<h2 id='http'>HTTP-level vulnerabilities</h2>
|
||||
|
||||
HTTP-level vulnerabilities
|
||||
|
||||
HTTP级别的漏洞
|
||||
|
||||
</h2>
|
||||
<h2 id='http'>HTTP级别的漏洞</h2>
|
||||
|
||||
Angular has built-in support to help prevent two common HTTP vulnerabilities, cross-site request
|
||||
forgery (CSRF or XSRF) and cross-site script inclusion (XSSI). Both of these must be mitigated primarily
|
||||
|
@ -339,13 +319,9 @@ on the server side, but Angular provides helpers to make integration on the clie
|
|||
Angular内置了一些支持来防范两个常见的HTTP漏洞:跨站请求伪造(XSRF)和跨站脚本包含(XSSI)。
|
||||
这两个漏洞主要在服务器端防范,但是Angular也自带了一些辅助特性,可以让客户端的集成变得更容易。
|
||||
|
||||
<h3 id='xsrf'>
|
||||
<h3 id='xsrf'>Cross-site request forgery</h3>
|
||||
|
||||
Cross-site request forgery
|
||||
|
||||
跨站请求伪造(XSRF)
|
||||
|
||||
</h3>
|
||||
<h3 id='xsrf'>跨站请求伪造(XSRF)</h3>
|
||||
|
||||
In a cross-site request forgery (CSRF or XSRF), an attacker tricks the user into visiting
|
||||
a different web page (such as `evil.com`) with malignant code that secretly sends a malicious request
|
||||
|
@ -413,13 +389,9 @@ See also Dave Smith's easy-to-understand
|
|||
|
||||
参见Dave Smith在<a href="https://www.youtube.com/watch?v=9inczw6qtpY" target="_blank" title="Cross Site Request Funkery Securing Your Angular Apps From Evil Doers">AngularConnect 2016关于XSRF的演讲</a>。
|
||||
|
||||
<h3 id='xssi'>
|
||||
<h3 id='xssi'>Cross-site script inclusion (XSSI)</h3>
|
||||
|
||||
Cross-site script inclusion (XSSI)
|
||||
|
||||
跨站脚本包含(XSSI)
|
||||
|
||||
</h3>
|
||||
<h3 id='xssi'>跨站脚本包含(XSSI)</h3>
|
||||
|
||||
Cross-site script inclusion, also known as JSON vulnerability, can allow an attacker's website to
|
||||
read data from a JSON API. The attack works on older browsers by overriding native JavaScript
|
||||
|
@ -445,13 +417,9 @@ post](https://security.googleblog.com/2011/05/website-security-for-webmasters.ht
|
|||
|
||||
要学习更多这方面的知识,请参见[谷歌Web安全博客文章](https://security.googleblog.com/2011/05/website-security-for-webmasters.html)的XSSI小节。
|
||||
|
||||
<h2 id='code-review'>
|
||||
<h2 id='code-review'>Auditing Angular applications</h2>
|
||||
|
||||
Auditing Angular applications
|
||||
|
||||
审计Angular应用程序
|
||||
|
||||
</h2>
|
||||
<h2 id='code-review'>审计Angular应用程序</h2>
|
||||
|
||||
Angular applications must follow the same security principles as regular web applications, and
|
||||
must be audited as such. Angular-specific APIs that should be audited in a security review,
|
||||
|
|
|
@ -11,7 +11,7 @@ This cookbook explains how to do it.
|
|||
|
||||
See the <live-example name="set-document-title"></live-example>.
|
||||
|
||||
参见<live-example name="set-document-title"></live-example>。
|
||||
参见<live-example name="set-document-title"></live-example>
|
||||
|
||||
## The problem with *<title>*
|
||||
|
||||
|
|
|
@ -89,6 +89,8 @@ a simple object with the following properties:
|
|||
|
||||
* `providers`: the configured providers.
|
||||
|
||||
`providers` - 配置好的服务提供商
|
||||
|
||||
In the <live-example name="ngmodules">live example</live-example>
|
||||
the root `AppModule` imports the `CoreModule` and adds the
|
||||
`providers` to the `AppModule` providers. Specifically,
|
||||
|
@ -118,12 +120,16 @@ Here's `forRoot()` that takes a `UserServiceConfig` object:
|
|||
|
||||
Lastly, call it within the `imports` list of the `AppModule`.
|
||||
|
||||
最后,我们在`AppModule`的`imports`*列表*中调用它。
|
||||
|
||||
<code-example path="ngmodules/src/app/app.module.ts" region="import-for-root" title="src/app/app.module.ts (imports)" linenums="false">
|
||||
|
||||
</code-example>
|
||||
|
||||
The app displays "Miss Marple" as the user instead of the default "Sherlock Holmes".
|
||||
|
||||
该应用不再显示默认的 “Sherlock Holmes”,而是用 “Miss Marple” 作为用户名称。
|
||||
|
||||
Remember to _import_ `CoreModule` as a Javascript import at the top of the file; don't add it to more than one `@NgModule` `imports` list.
|
||||
|
||||
<!-- KW--Does this mean that if we need it elsewhere we only import it at the top? I thought the services would all be available since we were importing it into `AppModule` in `providers`. -->
|
||||
|
@ -155,6 +161,10 @@ The `@Optional` decorator means not finding the service is OK.
|
|||
The injector returns `null`, the `parentModule` parameter is null,
|
||||
and the constructor concludes uneventfully.
|
||||
|
||||
默认情况下,当注入器找不到想找的提供商时,会抛出一个错误。
|
||||
但`@Optional`装饰器表示找不到该服务也无所谓。
|
||||
于是注入器会返回`null`,`parentModule`参数也就被赋成了空值,而构造函数没有任何异常。
|
||||
|
||||
It's a different story if you improperly import `CoreModule` into a lazy-loaded module such as `CustomersModule`.
|
||||
|
||||
Angular creates a lazy-loaded module with its own injector,
|
||||
|
|
|
@ -374,9 +374,6 @@ Its intended source is implicit.
|
|||
Angular sets `let-hero` to the value of the context's `$implicit` property
|
||||
which `NgFor` has initialized with the hero for the current iteration.
|
||||
|
||||
上下文中的属性`let-hero`没有指定过,实际上它来自一个隐式变量。
|
||||
Angular会把`let-hero`设置为上下文对象中的`$implicit`属性,`NgFor`会用当前迭代中的英雄初始化它。
|
||||
|
||||
* The [API guide](api/common/NgForOf "API: NgFor")
|
||||
describes additional `NgFor` directive properties and context properties.
|
||||
|
||||
|
|
|
@ -676,8 +676,6 @@ and reference assets of different types.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 02-04}
|
||||
|
||||
### Service names
|
||||
|
@ -1063,8 +1061,6 @@ For example, the prefix `toh` represents from **T**our **o**f **H**eroes and the
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 02-09}
|
||||
|
||||
### Pipe names
|
||||
|
@ -1808,8 +1804,6 @@ It is rarely worth the effort to change them at the risk of breaking existing co
|
|||
|
||||
**Consider** using an interface for data models.
|
||||
|
||||
**考虑**用类代替接口。
|
||||
|
||||
</div>
|
||||
|
||||
<div class="s-why">
|
||||
|
@ -1917,8 +1911,6 @@ discourage the `I` prefix.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 03-06}
|
||||
|
||||
### Import line spacing
|
||||
|
@ -2007,8 +1999,6 @@ Use the naming conventions for files in this guide.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 04-01}
|
||||
|
||||
### _LIFT_
|
||||
|
@ -2085,8 +2075,6 @@ A descriptive folder structure makes a world of difference to you and the people
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 04-03}
|
||||
|
||||
### Identify
|
||||
|
@ -2206,8 +2194,6 @@ Use a flatter structure until there is an obvious value to creating a new folder
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 04-05}
|
||||
|
||||
### _T-DRY_ (Try to be _DRY_)
|
||||
|
@ -3623,7 +3609,7 @@ A typical *lazy loaded folder* contains a *routing component*, its child compone
|
|||
|
||||
**Consider** giving components an _element_ selector, as opposed to _attribute_ or _class_ selectors.
|
||||
|
||||
**坚持**给组件一个*元素*选择器,而不是*属性*或*类*选择器。
|
||||
**考虑**给组件一个*元素*选择器,而不是*属性*或*类*选择器。
|
||||
|
||||
</div>
|
||||
|
||||
|
@ -3911,8 +3897,6 @@ and the directive name doesn't describe the property.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 05-14}
|
||||
|
||||
### Member sequence
|
||||
|
@ -4094,8 +4078,6 @@ helps instantly identify which members of the component serve which purpose.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 05-17}
|
||||
|
||||
### Put presentation logic in the component class
|
||||
|
@ -4190,8 +4172,6 @@ helps instantly identify which members of the component serve which purpose.
|
|||
|
||||
<a href="#toc">Back to top</a>
|
||||
|
||||
<a href="#toc">回到顶部</a>
|
||||
|
||||
{@a 06-03}
|
||||
|
||||
### _HostListener_/_HostBinding_ decorators versus _host_ metadata
|
||||
|
|
|
@ -1631,6 +1631,8 @@ followed by a dot (`.`) and the name of a CSS style property: `[style.style-prop
|
|||
Some style binding styles have a unit extension.
|
||||
The following example conditionally sets the font size in “em” and “%” units .
|
||||
|
||||
有些样式绑定中的样式带有单位。在这里,以根据条件用 “em” 和 “%” 来设置字体大小的单位。
|
||||
|
||||
<code-example path="template-syntax/src/app/app.component.html" region="style-binding-2" title="src/app/app.component.html" linenums="false">
|
||||
|
||||
</code-example>
|
||||
|
@ -3032,13 +3034,9 @@ because events stream *out* of that property and toward the handler in a templat
|
|||
从`HeroDetailComponent`角度来看,`HeroDetailComponent.deleteRequest`是个**输出**属性,
|
||||
因为事件从那个属性流*出*,流向模板绑定语句中的处理器。
|
||||
|
||||
<h3 id='aliasing-io'>
|
||||
<h3 id='aliasing-io'>Aliasing input/output properties</h3>
|
||||
|
||||
Aliasing input/output properties
|
||||
|
||||
给输入/输出属性起别名
|
||||
|
||||
</h3>
|
||||
<h3 id='aliasing-io'>给输入/输出属性起别名</h3>
|
||||
|
||||
Sometimes the public name of an input/output property should be different from the internal name.
|
||||
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
# Testing
|
||||
|
||||
# 测试
|
||||
|
||||
TBD. Original content [here](https://docs.google.com/document/d/1gGP5sqWNCHAWWV_GLdZQ1XyMO4K-CHksUxux0BFtVxk/edit#heading=h.ohqykkhzdhb2).
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -651,7 +651,7 @@ bootstrapping the AngularJS module.
|
|||
|
||||
For more information, see [NgModules](guide/ngmodules).
|
||||
|
||||
要了解Angular模块的更多信息,请参阅[Angular模块](guide/ngmodule)页。
|
||||
要了解更多,请参阅[NgModules](guide/ngmodule)页。
|
||||
|
||||
</div>
|
||||
|
||||
|
@ -1273,8 +1273,6 @@ compilation can pick it up.
|
|||
|
||||
You can then inject it in Angular using its class as a type annotation:
|
||||
|
||||
然后我们可以一个字符串型令牌,把它注入到Angular中:
|
||||
|
||||
<code-example path="upgrade-module/src/app/ajs-to-a-providers/hero-detail.component.ts" title="hero-detail.component.ts">
|
||||
|
||||
</code-example>
|
||||
|
|
|
@ -46,13 +46,9 @@ Note that the resulting code does not map to the docs. Adjust accordingly.
|
|||
|
||||
</div>
|
||||
|
||||
<h2 id='prereq1'>
|
||||
<h2 id='prereq1'>Prerequisite: Node.js</h2>
|
||||
|
||||
Prerequisite: Node.js
|
||||
|
||||
前提条件: Node.js
|
||||
|
||||
</h2>
|
||||
<h2 id='prereq1'>前提条件: Node.js</h2>
|
||||
|
||||
Install **[Node.js® and npm](https://nodejs.org/en/download/)**
|
||||
if they are not already on your machine.
|
||||
|
@ -69,13 +65,9 @@ Older versions produce errors.
|
|||
|
||||
</div>
|
||||
|
||||
<h2 id='prereq2'>
|
||||
<h2 id='prereq2'>Prerequisite: Visual Studio 2015 Update 3</h2>
|
||||
|
||||
Prerequisite: Visual Studio 2015 Update 3
|
||||
|
||||
前提条件: Visual Studio 2015 Update 3
|
||||
|
||||
</h2>
|
||||
<h2 id='prereq2'>前提条件: Visual Studio 2015 Update 3</h2>
|
||||
|
||||
The minimum requirement for developing Angular applications with Visual Studio is Update 3.
|
||||
Earlier versions do not follow the best practices for developing applications with TypeScript.
|
||||
|
@ -90,13 +82,9 @@ Or use `Tools | Extensions and Updates` to update to Update 3 directly from Visu
|
|||
|
||||
如果还没有,安装**[Visual Studio 2015 Update 3](https://www.visualstudio.com/en-us/news/releasenotes/vs2015-update3-vs)**。或者使用`Tools | Extensions and Updates`来直接在Visual Studio 2015中更新到Update 3。
|
||||
|
||||
<h2 id='prereq3'>
|
||||
<h2 id='prereq3'>Prerequisite: Configure External Web tools</h2>
|
||||
|
||||
Prerequisite: Configure External Web tools
|
||||
|
||||
前提条件: 配置External Web tools
|
||||
|
||||
</h2>
|
||||
<h2 id='prereq3'>前提条件: 配置External Web tools</h2>
|
||||
|
||||
Configure Visual Studio to use the global external web tools instead of the tools that ship with Visual Studio:
|
||||
|
||||
|
@ -129,13 +117,9 @@ find them in either location, it will use its own versions of the tools.
|
|||
|
||||
Visual Studio将优先在当前的工作区查找外部工具,如果没有找到,便查找全局路径,如果还没有找到,Visual Studio就使用自带的工具版本。
|
||||
|
||||
<h2 id='prereq4'>
|
||||
<h2 id='prereq4'>Prerequisite: Install TypeScript 2.2 for Visual Studio 2015</h2>
|
||||
|
||||
Prerequisite: Install TypeScript 2.2 for Visual Studio 2015
|
||||
|
||||
前提条件: 安装TypeScript 2.2 for Visual Studio 2015
|
||||
|
||||
</h2>
|
||||
<h2 id='prereq4'>前提条件: 安装TypeScript 2.2 for Visual Studio 2015</h2>
|
||||
|
||||
While Visual Studio Update 3 ships with TypeScript support out of the box, it currently doesn’t ship with TypeScript 2.2,
|
||||
which you need to develop Angular applications.
|
||||
|
@ -163,26 +147,18 @@ restart it to make sure everything is clean.
|
|||
|
||||
至此,Visual Studio准备好了。重新启动Visual Stuido,这样我们可以有一个崭新的开始。
|
||||
|
||||
<h2 id='download'>
|
||||
<h2 id='download'>Step 1: Download the QuickStart files</h2>
|
||||
|
||||
Step 1: Download the QuickStart files
|
||||
|
||||
第一步: 现在“快速上手”文件
|
||||
|
||||
</h2>
|
||||
<h2 id='download'>第一步: 现在“快速上手”文件</h2>
|
||||
|
||||
[Download the QuickStart source](https://github.com/angular/quickstart)
|
||||
from GitHub. If you downloaded as a zip file, extract the files.
|
||||
|
||||
从GitHub[下载“快速上手”的源代码](https://github.com/angular/quickstart)。如果下载的是一个压缩的zip文件,解压它。
|
||||
|
||||
<h2 id='create-project'>
|
||||
<h2 id='create-project'>Step 2: Create the Visual Studio ASP.NET project</h2>
|
||||
|
||||
Step 2: Create the Visual Studio ASP.NET project
|
||||
|
||||
第二步:创建Visual Studio ASP.net项目
|
||||
|
||||
</h2>
|
||||
<h2 id='create-project'>第二步:创建Visual Studio ASP.net项目</h2>
|
||||
|
||||
Create the ASP.NET 4.x project in the usual way as follows:
|
||||
|
||||
|
@ -213,13 +189,9 @@ no authentication, and no hosting. Pick the template and options appropriate for
|
|||
|
||||
</div>
|
||||
|
||||
<h2 id='copy'>
|
||||
<h2 id='copy'>Step 3: Copy the QuickStart files into the ASP.NET project folder</h2>
|
||||
|
||||
Step 3: Copy the QuickStart files into the ASP.NET project folder
|
||||
|
||||
第三步: 把“快速上手”的文件复制到ASP.NET项目所在的目录
|
||||
|
||||
</h2>
|
||||
<h2 id='copy'>第三步: 把“快速上手”的文件复制到ASP.NET项目所在的目录</h2>
|
||||
|
||||
Copy the QuickStart files you downloaded from GitHub into the folder containing the `.csproj` file.
|
||||
Include the files in the Visual Studio project as follows:
|
||||
|
@ -248,13 +220,9 @@ Include the files in the Visual Studio project as follows:
|
|||
|
||||
* src/tsconfig.json
|
||||
|
||||
<h2 id='restore'>
|
||||
<h2 id='restore'>Step 4: Restore the required packages</h2>
|
||||
|
||||
Step 4: Restore the required packages
|
||||
|
||||
第四步: 恢复需要的包
|
||||
|
||||
</h2>
|
||||
<h2 id='restore'> 第四步: 恢复需要的包 </h2>
|
||||
|
||||
Restore the packages required for an Angular application as follows:
|
||||
|
||||
|
@ -289,13 +257,9 @@ Restore the packages required for an Angular application as follows:
|
|||
|
||||
**不要**将`node_modules`目录添加到项目中,让它隐藏。
|
||||
|
||||
<h2 id='build-and-run'>
|
||||
<h2 id='build-and-run'>Step 5: Build and run the app</h2>
|
||||
|
||||
Step 5: Build and run the app
|
||||
|
||||
第五步:构建和运行应用
|
||||
|
||||
</h2>
|
||||
<h2 id='build-and-run'>第五步:构建和运行应用</h2>
|
||||
|
||||
First, ensure that `src/index.html` is set as the start page.
|
||||
Right-click `index.html` in Solution Explorer and select option `Set As Start Page`.
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
<h1 class="no-toc">What is Angular?</h1>
|
||||
|
||||
<h1 class="no-toc">什么是 Angular?</h1>
|
||||
|
||||
Angular is a platform that makes it easy to build applications with the web. Angular combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges. Angular empowers developers to build applications that live on the web, mobile, or the desktop
|
||||
|
||||
Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到端工具和一些最佳实践于一身,为你解决开发方面的各种挑战。Angular 为开发者提升构建 Web、手机或桌面应用的能力。
|
||||
|
@ -11,48 +13,30 @@ Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angu
|
|||
|
||||
<section>Get a Glimpse of Angular</section>
|
||||
|
||||
<section>Angular 走马观花</section>
|
||||
|
||||
<p>A quick look at an Angular "hello world" application.</p>
|
||||
|
||||
<p>快速体验 Angular 的 "hello world" 应用。</p>
|
||||
|
||||
<p class="card-footer">Angular in Action</p>
|
||||
|
||||
<p class="card-footer">体验 Angular</p>
|
||||
|
||||
</a>
|
||||
|
||||
<a href="guide/quickstart" class="docs-card" title="Angular Quickstart">
|
||||
|
||||
<section>Get Going with Angular</section>
|
||||
|
||||
<section>开始使用 Angular</section>
|
||||
|
||||
<p>Get going on your own environment with the Quickstart.</p>
|
||||
|
||||
<p>跟随"快速上手"构建你的开发环境</p>
|
||||
|
||||
<p class="card-footer">Quickstart</p>
|
||||
|
||||
<p class="card-footer">快速上手</p>
|
||||
|
||||
</a>
|
||||
|
||||
<a href="guide/architecture" class="docs-card" title="Angular Architecture">
|
||||
|
||||
<section>Fundamentals</section>
|
||||
|
||||
<section>基本原理</section>
|
||||
|
||||
<p>Learn Angular application fundamentals, starting with an architecture overview.</p>
|
||||
|
||||
<p>学习 Angular 应用的基本原理。<br/>从架构概览开始。</p>
|
||||
|
||||
<p class="card-footer">Architecture</p>
|
||||
|
||||
<p class="card-footer">架构</p>
|
||||
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
|
|
@ -186,6 +186,8 @@ method included in the sample source code.
|
|||
|
||||
### Error handling
|
||||
|
||||
### 错误处理
|
||||
|
||||
Things go wrong, especially when you're getting data from a remote server.
|
||||
The `HeroService.getHeroes()` method should catch errors and do something appropriate.
|
||||
|
||||
|
|
Loading…
Reference in New Issue