diff options
| author | Brian Ford | 2014-03-02 23:22:26 -0800 |
|---|---|---|
| committer | Brian Ford | 2014-03-02 23:22:26 -0800 |
| commit | 8d6eed21d219e459331a9f08fd46f8c67a9553da (patch) | |
| tree | 4d43d6c18f9eb543608db898ccddde329db9f843 /docs/content | |
| parent | 7c34e1f1a7a19faade45345ace22cf458bdd1142 (diff) | |
| download | angular.js-8d6eed21d219e459331a9f08fd46f8c67a9553da.tar.bz2 | |
docs(guide/templates): clarity
Diffstat (limited to 'docs/content')
| -rw-r--r-- | docs/content/guide/templates.ngdoc | 47 |
1 files changed, 21 insertions, 26 deletions
diff --git a/docs/content/guide/templates.ngdoc b/docs/content/guide/templates.ngdoc index 92aee6ee..8b60579f 100644 --- a/docs/content/guide/templates.ngdoc +++ b/docs/content/guide/templates.ngdoc @@ -2,27 +2,21 @@ @name Templates @description -An Angular template is the declarative specification that, along with information from the model -and controller, becomes the rendered view that a user sees in the browser. It is the static DOM, -containing HTML, CSS, and angular-specific elements and angular-specific element attributes. The -Angular elements and attributes direct angular to add behavior and transform the template DOM into -the dynamic view DOM. +In Angular, templates are written with HTML that contains Angular-specific elements and attributes. +Angular combines the template with information from the model and controller to render the dynamic +view that a user sees in the browser. -These are the types of Angular elements and element attributes you can use in a template: +These are the types of Angular elements and attributes you can use: * {@link guide/directive Directive} — An attribute or element that - augments an existing DOM element or represents a reusable DOM component - a widget. -* {@link ng.$interpolate Markup} — The double -curly brace notation `{{ }}` to bind expressions to elements is built-in angular markup. -* {@link guide/filter Filter} — Formats your data for display to the user. -* {@link forms Form controls} — Lets you validate user input. + augments an existing DOM element or represents a reusable DOM component. +* {@link ng.$interpolate Markup} — The double curly brace notation `{{ }}` to bind expressions + to elements is built-in Angular markup. +* {@link guide/filter Filter} — Formats data for display. +* {@link forms Form controls} — Validates user input. -Note: In addition to declaring the elements above in templates, you can also access these elements -in JavaScript code. - -The following code snippet shows a simple Angular template made up of standard HTML tags along with -Angular {@link guide/directive directives} and curly-brace bindings -with {@link expression expressions}: +The following code snippet shows a template with {@link guide/directive directives} and +curly-brace {@link expression expression} bindings: ```html <html ng-app> @@ -38,19 +32,20 @@ with {@link expression expressions}: </html> ``` -In a simple single-page app, the template consists of HTML, CSS, and angular directives contained -in just one HTML file (usually `index.html`). In a more complex app, you can display multiple views -within one main page using "partials", which are segments of template located in separate HTML -files. You "include" the partials in the main page using the {@link ngRoute.$route -$route} service in conjunction with the {@link ngRoute.directive:ngView ngView} directive. An -example of this technique is shown in the {@link tutorial/ angular tutorial}, in steps seven and -eight. +In a simple app, the template consists of HTML, CSS, and Angular directives contained +in just one HTML file (usually `index.html`). + +In a more complex app, you can display multiple views within one main page using "partials" – +segments of template located in separate HTML files. You can use the +{@link ngRoute.directive:ngView ngView} directive to load partials based on configuration passed +to the {@link ngRoute.$route $route} service. The {@link tutorial/ angular tutorial} shows this +technique in steps seven and eight. ## Related Topics -* {@link guide/filter Angular Filters} -* {@link forms Angular Forms} +* {@link guide/filter Filters} +* {@link forms Forms} ## Related API |