{"id":59690,"date":"2018-05-02T17:20:00","date_gmt":"2018-05-02T11:50:00","guid":{"rendered":"https:\/\/www.vskills.in\/certification\/tutorial\/?p=59690"},"modified":"2024-04-12T14:20:43","modified_gmt":"2024-04-12T08:50:43","slug":"angular-templates","status":"publish","type":"page","link":"https:\/\/www.vskills.in\/certification\/tutorial\/angular-templates\/","title":{"rendered":"Angular Templates"},"content":{"rendered":"

Angular Templates<\/h1>\n

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.<\/p>\n

These are the types of AngularJS elements and attributes you can use:<\/p>\n

Directive \u2014 An attribute or element that augments an existing DOM element or represents a reusable DOM component.
\nMarkup \u2014 The double curly brace notation {{ }} to bind expressions to elements is built-in AngularJS markup.
\nFilter \u2014 Formats data for display.
\nForm controls \u2014 Validates user input.<\/p>\n

The following code snippet shows a template with directives and curly-brace expression bindings:<\/p>\n

<html ng-app>
\n<!– Body tag augmented with ngController directive –>
\n<body ng-controller=”MyController”>
\n<input ng-model=”foo” value=”bar”>
\n<!– Button tag with ngClick directive, and
\nstring expression ‘buttonText’
\nwrapped in “{{ }}” markup –>
\n<button ng-click=”changeFoo()”>{{buttonText}}<\/button>
\n<script src=”angular.js”><\/script>
\n<\/body>
\n<\/html><\/p>\n

In a simple app, the template consists of HTML, CSS, and AngularJS directives contained in just one HTML file (usually index.html).<\/p>\n

In a more complex app, you can display multiple views within one main page using “partials” \u2013 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.<\/p>\n

IT Professionals, Web Developers, Web Programmers, IT students can Apply for the certification course to move ahead in their careers.<\/strong><\/p>\n

\"\"<\/a><\/p>\n