invisi/angular.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Wiki Activity

docs(guide/templates): clarity

Browse Source
This commit is contained in:
Brian Ford
2014-03-02 23:22:26 -08:00
parent 7c34e1f1a7
commit 8d6eed21d2
1 changed files with 21 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/content/guide/templates.ngdoc
+21 -26
View File
@@ -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