diff --git a/public/docs/ts/latest/quickstart.jade b/public/docs/ts/latest/quickstart.jade
index cf978e0a00..71c9766fb6 100644
--- a/public/docs/ts/latest/quickstart.jade
+++ b/public/docs/ts/latest/quickstart.jade
@@ -3,7 +3,7 @@ block includes
- var _on_Plunkr = 'on Plunkr';
:marked
- Angular applications are made of _components_.
+ Angular applications are made up of _components_.
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:
+makeExample('app/app.component.ts')(format='.')
@@ -15,17 +15,17 @@ block includes
Every component begins with an `@Component` [!{_decorator}](glossary.html#!{_decorator} '"!{_decorator}" explained')
function that
takes a _metadata_ object. The metadata object describes how the HTML template and component class work together.
-
+
The `selector` property tells Angular to display the component inside a custom `` tag in the `index.html`.
+makeExample('index.html','my-app','index.html (inside )')(format='.')
:marked
The `template` property defines a message inside an `` header.
- The message starts with "Hello" and ends with `{{name}}`
+ The message starts with "Hello" and ends with `{{name}}`,
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.
-
+ At runtime, Angular replaces `{{name}}` with the value of the component's `name` property.
+
In the example, change the component class's `name` property from `'Angular'` to `'World'` and see what happens.
-
+
Interpolation binding is one of many Angular features you'll discover in this documentation.
+ifDocsFor('ts')