Execute
<!DOCTYPE html> <html> <html > <head> <title>Wikitechy Agular JS Tutorials</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> </head> <body> <h1>Restictions of Directives in AngularJS</h1> <div ng-app="myApp"> <h3>Invoked by Element Name</h3> <my-own-directive></my-own-directive> <h3>Invoked by Attribute Name</h3> <div my-own-directive></div> <h3>Invoked by Class Name</h3> <div class="my-own-directive"></div> <h3>Invoked by Comment</h3> <!-- directive: my-own-directive --> </div> <script> var app = angular.module("myApp", []); app.directive("myOwnDirective", function() { return { restrict : "AECM", replace : true, template : "<p>This is my Own Directive</p>" }; }); </script> </body> </html>
www.wikitechy.com © Copyright 2016. All Rights Reserved.