Merge pull request #159 from todoubaba/forms
Polish forms.jade (round 2)
This commit is contained in:
commit
f02b66490a
|
@ -72,13 +72,13 @@ include ../_util-fns
|
|||
:marked
|
||||
That's not the only way to create a form but it's the way we'll cover in this guide.
|
||||
|
||||
这不是创建表单的唯一方式,本章中只介绍模板驱动的表单。(译注:Angular支持的另一种方式叫做模型驱动表单Model-Driven Forms)
|
||||
这不是创建表单的唯一方式,本章中只介绍模板驱动的表单。
|
||||
:marked
|
||||
We can build almost any form we need with an Angular template — login forms, contact forms ... pretty much any business forms.
|
||||
We can lay out the controls creatively, bind them to data, specify validation rules and display validation errors,
|
||||
conditionally enable or disable specific controls, trigger built-in visual feedback, and much more.
|
||||
|
||||
利用Angular模板,可以构建几乎所有表单 —— 登录表单、联系人表单…… 以及任何的商务表单。
|
||||
利用 Angular 模板,可以构建几乎所有表单 — 登录表单、联系人表单…… 以及任何的商务表单。
|
||||
可以创造性的摆放各种控件、把它们绑定到数据、指定校验规则、显示校验错误、有条件的禁用或
|
||||
启用特定的控件、触发内置的视觉反馈等等,不胜枚举。
|
||||
|
||||
|
@ -188,7 +188,7 @@ figure.image-display
|
|||
and one optional field (`alterEgo`).
|
||||
|
||||
最简单的模型是个“属性包”,用来存放应用中一件事物的事实。
|
||||
这里使用三个必备字段 (`id`、`name`、`power`),和一个可选字段 (`alterEgo`,译注:中文含义:第二人格,比如X战警中的Jean/黑凤凰)。
|
||||
这里使用三个必备字段 (`id`、`name`、`power`),和一个可选字段 (`alterEgo`,译注:中文含义是第二人格,例如 X 战警中的 Jean / 黑凤凰)。
|
||||
|
||||
Create a new file in the app folder called `hero.ts` and give it the following class definition:
|
||||
|
||||
|
@ -321,7 +321,7 @@ code-example(format="").
|
|||
`app.module.ts` defines the application's root module. In it we identify the external modules we'll use in our application
|
||||
and declare the components that belong to this module, such as our `HeroFormComponent`.
|
||||
|
||||
`app.module.ts`定义了应用的根模块。其中标识即将用到的外部模块,以及声明属于本模块中的组件,如`HeroFormComponent`。
|
||||
`app.module.ts`定义了应用的根模块。其中标识即将用到的外部模块,以及声明属于本模块中的组件,例如`HeroFormComponent`。
|
||||
|
||||
Because template-driven forms are in their own module, we need to add the `FormsModule` to the array of
|
||||
`imports` for our application module before we can use forms.
|
||||
|
@ -526,7 +526,7 @@ figure.image-display
|
|||
makes binding our form to the model super-easy.
|
||||
|
||||
虽然可以在表单中再次使用这些技术。
|
||||
但是,这里将介绍个新东西 —— `[(ngModel)]`语法,使表单绑定到模型的工作变得超级简单。
|
||||
但是,这里将介绍个新东西,`[(ngModel)]`语法,使表单绑定到模型的工作变得超级简单。
|
||||
|
||||
Find the `<input>` tag for the "Name" and update it like this
|
||||
|
||||
|
@ -696,7 +696,7 @@ figure.image-display
|
|||
the event handling such as debounce or throttle the key strokes.
|
||||
|
||||
很高兴知道这些,但是这样现实吗?实践上中,几乎总是优先使用`[(ngModel)]`形式的双向绑定。
|
||||
只有当需要在事件处理函数中做一些特别的事情(比如合并或限制按键频率)时,才会拆分出独立的事件处理函数。
|
||||
只有当需要在事件处理函数中做一些特别的事情(例如合并或限制按键频率)时,才会拆分出独立的事件处理函数。
|
||||
|
||||
Learn more about `NgModel` and other template syntax in the
|
||||
[Template Syntax](./template-syntax.html) guide.
|
||||
|
@ -1213,7 +1213,7 @@ figure.image-display
|
|||
|
||||
- Template reference variables such as `#heroForm`, `#name` and `#power`.
|
||||
|
||||
模板引用变量,如`#heroForm`、`#name`和`#power`。
|
||||
模板引用变量,例如`#heroForm`、`#name`和`#power`。
|
||||
|
||||
- The `[(ngModel)]` syntax and a `name` attribute for two-way data binding, validation and change tracking.
|
||||
|
||||
|
|
Loading…
Reference in New Issue