review quickstart.
This commit is contained in:
parent
a685691348
commit
f1896230b2
|
@ -5,11 +5,11 @@ block includes
|
|||
:marked
|
||||
Angular applications are made of _components_.
|
||||
|
||||
Angular应用是由*组件*组成的。
|
||||
Angular 应用是由*组件*组成的。
|
||||
|
||||
A _component_ is the combination of an HTML template and a component class that controls a portion of the screen. Here is an example of a component that displays a simple string:
|
||||
|
||||
*组件*由HTML模板和组件类组成,组件类控制视图。下面是一个显示简单字符串的组件:
|
||||
*组件*由 HTML 模板和组件类组成,组件类控制视图。下面是一个显示简单字符串的组件:
|
||||
|
||||
+makeExample('app/app.component.ts')(format='.')
|
||||
|
||||
|
@ -17,17 +17,17 @@ block includes
|
|||
You can try this out without installing anything. Open the <live-example>QuickStart example !{_on_Plunkr}</live-example> in another tab
|
||||
and follow along.
|
||||
|
||||
无需安装任何东西,你就可以试试它。在另一个浏览器标签页打开并跟随<live-example>Plunkr上的《快速起步》例子</live-example>。
|
||||
无需任何安装就可以试试它。在另一个浏览器标签页打开并跟随<live-example> Plunker 上的《快速起步》例子</live-example>。
|
||||
|
||||
Every component begins with an `@Component` [!{_decorator}](glossary.html#!{_decorator} '"!{_decorator}" explained')
|
||||
<span if-docs="ts">function</span> that
|
||||
<span if-docs="ts">takes a _metadata_ object. The metadata object</span> describes how the HTML template and component class work together.
|
||||
|
||||
每个组件都以`@Component`[装饰器](glossary.html#!{_decorator} '"!{_decorator}" explained')<span if-docs="ts">函数</span>开始,它<span if-docs="ts">接受一个_元数据_对象参数。该元素对象</span>描述了HTML模板和组件类是如何一起工作的。
|
||||
每个组件都以`@Component`[装饰器](glossary.html#!{_decorator} '"!{_decorator}" explained')<span if-docs="ts">函数</span>开始,它<span if-docs="ts">接受一个_元数据_对象参数。该元素对象</span>描述了 HTML 模板和组件类是如何一起工作的。
|
||||
|
||||
The `selector` property tells Angular to display the component inside a custom `<my-app>` tag in the `index.html`.
|
||||
|
||||
`selector`属性告诉 Angular 在`index.html`中的自定义`<my-app>`标签里显示该组件。
|
||||
`selector`属性为 Angular 指定了在`index.html`中的自定义`<my-app>`标签里显示该组件。
|
||||
|
||||
+makeExample('index.html','my-app','index.html (inside <body>)')(format='.')
|
||||
:marked
|
||||
|
@ -36,8 +36,8 @@ block includes
|
|||
which is an Angular [interpolation binding](guide/displaying-data.html) expression.
|
||||
At runtime, Angular replaces `{{name}}` with the value of the component's `name` property.
|
||||
|
||||
`template`属性定义了`<h1>`标题的一条消息。
|
||||
该消息以“Hello”开始,以 Angular [插值绑定](guide/displaying-data.html)表达式`{{name}}`结束。
|
||||
`template`属性定义了`<h1>`标题里的一条消息。
|
||||
该消息以 “Hello” 开始,以 Angular [插值绑定](guide/displaying-data.html)表达式`{{name}}`结束。
|
||||
在运行时,Angular 用组件的`name`属性值替换`{{name}}`。
|
||||
|
||||
In the example, change the component class's `name` property from `'Angular'` to `'World'` and see what happens.
|
||||
|
|
Loading…
Reference in New Issue