angular-cn/aio/content/quickstart.md

1.5 KiB

@description

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:


Try this **<live-example noDownload>QuickStart example on Plunker</live-example>** without installing anything.
Try it locally with the [***QuickStart seed***](guide/setup)
and prepare for development of a real Angular application.


Every component begins with an @Component !{_decorator} 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 <my-app> tag in the index.html.

The template property defines a message inside an <h1> header. The message starts with "Hello" and ends with {{name}}, which is an Angular interpolation binding expression. At runtime, Angular replaces {{name}} with the value of the component's name property. Interpolation binding is one of many Angular features you'll discover in this documentation.


### Next step

Start [**learning Angular**](guide/learning-angular).