fix: forms, style guide and template syntax

This commit is contained in:
Zhimin YE 2016-10-18 10:47:45 +01:00
parent e4a74dbff8
commit 9cdc23c0f7
3 changed files with 10 additions and 106 deletions

View File

@ -575,6 +575,8 @@ figure.image-display
attached to the `<form>` tag. Each `FormControl` is registered under the name we assigned to the `name` attribute. attached to the `<form>` tag. Each `FormControl` is registered under the name we assigned to the `name` attribute.
We'll talk about `NgForm` [later in this chapter](#ngForm). We'll talk about `NgForm` [later in this chapter](#ngForm).
在内部Angular创建`FormControls`并将它们注册到一个`NgForm`指令Angular将该指令附加到`<form>`标签。每个`FormControl`被注册为我们指定的`name`属性名字。[本章后面](#ngForm)讲述了`NgForm`。
:marked :marked
Let's add similar `[(ngModel)]` bindings and `name` attributes to *Alter Ego* and *Hero Power*. Let's add similar `[(ngModel)]` bindings and `name` attributes to *Alter Ego* and *Hero Power*.
We'll ditch the input box binding message We'll ditch the input box binding message

View File

@ -1278,37 +1278,6 @@ a(href="#toc") 回到顶部
:marked :marked
a(href="#toc") Back to top a(href="#toc") Back to top
a(href="#toc") 回到顶部
.l-main-section
:marked
### <a id="03-05"></a>Import Destructuring Spacing
### <a id="03-05"></a>导入语句解构表达式中的空格
#### <a href="#03-05">Style 03-05</a>
#### <a href="#03-05">风格03-05</a>
.s-rule.do
:marked
**Do** leave one whitespace character inside of the `import` statements' curly braces when destructuring.
**坚持**解构时,在`import`声明的大括号里留一个空格字符。
.s-why.s-why-last
:marked
**Why?** Whitespace makes it easier to read the imports.
**为何?**空格让import声明更易于阅读。
+makeExample('style-guide/ts/03-05/app/+heroes/shared/hero.service.avoid.ts', 'example', 'app/+heroes/shared/hero.service.ts')(avoid=1)
:marked
+makeExample('style-guide/ts/03-05/app/+heroes/shared/hero.service.ts', 'example', 'app/+heroes/shared/hero.service.ts')
:marked
a(href="#toc") Back to top
a(href="#toc") 回到顶部 a(href="#toc") 回到顶部
.l-main-section .l-main-section
@ -1763,7 +1732,6 @@ a(href="#toc") 回到顶部
a(href="#file-tree") 点这里查看目录和文件结构的范例 a(href="#file-tree") 点这里查看目录和文件结构的范例
a(href="#toc") Back to top a(href="#toc") Back to top
:marked
a(href="#toc") 回到顶部 a(href="#toc") 回到顶部
@ -1805,6 +1773,8 @@ a(href="#toc") 回到顶部
a(href="#toc") Back to top a(href="#toc") Back to top
a(href="#toc") 回到顶部
.l-main-section .l-main-section
:marked :marked
### <a id="04-09"></a>Feature Modules ### <a id="04-09"></a>Feature Modules
@ -2198,54 +2168,6 @@ a(href="#toc") Back to top
a(href="#toc") 回到顶部 a(href="#toc") 回到顶部
.l-main-section
:marked
### <a id="04-12"></a>Prefix Lazy Loaded Folders with +
### <a id="04-12"></a>为惰性加载目录名字加前缀+
#### <a href="#04-12">Style 04-12</a>
#### <a href="#04-12">样式04-12</a>
.s-rule.do
:marked
**Do** prefix the name of a *lazy loaded folder* with a (+) e.g., `+dashboard/`.
**坚持**使用一个(+)前缀来标记*惰性加载目录*名字,比如`+dashboard/`。
.s-why
:marked
**Why?** Lazy loaded code paths are easily identifiable by their `+` prefix.
**为何?**通过`+`前缀,惰性加载的源代码可以很容易被识别。
.s-why
:marked
**Why?** Lazy loaded code paths are easily distinguishable from non lazy loaded paths.
**为何?**惰性加载路径和非惰性加载的路径很容易被区分开来。
.s-why.s-why-last
:marked
**Why?** If we see an `import` path that contains a `+`, we can quickly refactor to use lazy loading.
**为何?**如果看到包含`+`的`import`路径,我们能快速使用惰性加载进行重构。
.example-title Lazy Loaded Folders 惰性加载目录
.filetree
.file src
.children
.file app
.children
.file +dashboard
.children
.file dashboard.component.ts|html|css|spec.ts
.file index.ts
:marked
a(href="#toc") Back to top
a(href="#toc") 回到顶部
.l-main-section .l-main-section
:marked :marked
### <a id="04-13"></a>Lazy Loaded Folders ### <a id="04-13"></a>Lazy Loaded Folders
@ -2297,31 +2219,6 @@ a(href="#toc") Back to top
a(href="#toc") 回到顶部 a(href="#toc") 回到顶部
.l-main-section
:marked
### <a id="04-15"></a>Use Component Router to Lazy Load
### <a id="04-15"></a>使用组件路由器来惰性加载
#### <a href="#04-15">Style 04-15</a>
#### <a href="#04-15">风格04-15</a>
.s-rule.do
:marked
**Do** use the Component Router to lazy load routable features.
**坚持**使用组件路由器来惰性加载可以路由的特性。
.s-why.s-why-last
:marked
**Why?** That's the easiest way to load a module on demand.
**为何?**这是最简单的按需加载模块的方法。
a(href="#toc") Back to top
a(href="#toc") 回到顶部
.l-main-section .l-main-section
:marked :marked
## Components ## Components
@ -3033,6 +2930,8 @@ a(href="#toc") 回到顶部
a(href="#toc") Back to top a(href="#toc") Back to top
a(href="#toc") 回到顶部
.l-main-section .l-main-section
:marked :marked
### <a id="09-01"></a>Implement Lifecycle Hooks Interfaces ### <a id="09-01"></a>Implement Lifecycle Hooks Interfaces

View File

@ -2080,12 +2080,15 @@ figure.image-display
### 引用一个模板引用变量 ### 引用一个模板引用变量
We can refer to a template reference variable _anywhere_ in the current template. We can refer to a template reference variable _anywhere_ in the current template.
我们可以在同一元素、兄弟元素或任何子元素中引用模板引用变量。
.l-sub-section .l-sub-section
:marked :marked
Do not define the same variable name more than once in the same template. Do not define the same variable name more than once in the same template.
The runtime value will be unpredictable. The runtime value will be unpredictable.
我们可以在同一元素、兄弟元素或任何子元素中引用模板引用变量。 不要在同一个模版中多次定义同一个变量名,否则运行时的值将会不可预测。
:marked :marked
Here are two other examples of creating and consuming a Template reference variable: Here are two other examples of creating and consuming a Template reference variable: