Angular Templates
Angular templates are written with HTML that contains AngularJS-specific elements and attributes. AngularJS 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 AngularJS elements and attributes you can use:
Directive — An attribute or element that augments an existing DOM element or represents a reusable DOM component.
Markup — The double curly brace notation {{ }} to bind expressions to elements is built-in AngularJS markup.
Filter — Formats data for display.
Form controls — Validates user input.
The following code snippet shows a template with directives and curly-brace expression bindings:
<html ng-app>
<!– Body tag augmented with ngController directive –>
<body ng-controller=”MyController”>
<input ng-model=”foo” value=”bar”>
<!– Button tag with ngClick directive, and
string expression ‘buttonText’
wrapped in “{{ }}” markup –>
<button ng-click=”changeFoo()”>{{buttonText}}</button>
<script src=”angular.js”></script>
</body>
</html>
In a simple app, the template consists of HTML, CSS, and AngularJS 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 ngView directive to load partials based on configuration passed to the $route service. The AngularJS tutorial shows this technique in steps seven and eight.
IT Professionals, Web Developers, Web Programmers, IT students can Apply for the certification course to move ahead in their careers.
Back to Angular 4 Tutorial Main Page 
