bing
Flat 10% & upto 50% off + Free additional Courses. Hurry up!
×
UPTO
50%
OFF!

AngularJS Directives

Directives are used to extend HTML. It is a started with ng-prefix. AngularJS contains following directives:

1.  ng-app Directive – It is used to initialize an AngularJS application.

e.g.

<div ng-app = "">

...

</div>

 

2. ng-init Directive – It is used to initialize application data.

e.g.

<div ng-app="" ng-init="name=['abc','xyz']">

//code

</div>

 

3. ng-model directive – It associates the value of HTML controls with the application data.

e.g.

<div ng-app = "">

//code

<p>Enter Text:<input type = "text" ng-model = "name"></p>

</div>

 

4. ng-repeat directive – It is used  to repeat HTML elements for every item in a collection.

e.g.

<div ng-app="" ng-init="names=['abc','xyz']">
<ul>
<li ng-repeat="n in names">
{{ n }}
</li>
</ul>
</div>

 

Example

<html>

<head>

<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

<title>Directive Example</title>

</head>

<body>

<h1> Example of Directive</h1>

<div ng-app="" ng-init="names=['abc','xyz']">

<p>Enter Text:<input type = "text" ng-model = "name"></p>
<ul>
<li ng-repeat="n in names">
{{ n }}
</li>
</ul>
</div>

</body>

</html>

 Output

output3

"0 Responses on AngularJS Directives"

100% Secure Payments. All major credit & debit cards accepted Or Pay by Paypal.
top

Sales Offer

  • To avail this offer, enroll before 22nd September 2017.
  • This offer cannot be combined with any other offer.
  • This offer is valid on selected courses only.
  • Please use coupon codes mentioned below to avail the offer
offer-june

Sign Up or Login to view the Free AngularJS Directives.