Understanding Custom Directives in AngularJS

  • Element directives: To use directive as an element you have to write element tag.
  • Starting with Chrome version 45, NPAPI is no longer supported for Google Chrome.
  • Javascript HTML tags Directives in AngularJS
  • It tells AngularJS’s html compiler to attach any directive to DOM element.
  • We have detected you are using Google Chrome and might be unable to use the Java plugin from this browser.

Blogs posted in Javascript. The title is Understanding Custom Directives in AngularJS – Find Nerd

@Ashishbishtevo: Understanding Custom Directives in #angularjs #javascript #html5 #webdev #webdevelopment…

AngularJs Directives are used on a DOM element like any attribute, name of the element, some css class or any comment. It tells AngularJS’s html compiler to attach any directive to DOM element. all data bind attributes with ng- are in-built directives like ng-app, ng-controller in angularjs.

Custom directives are those directives which have their own functions and run when DOM is compiled. If you want to reuse the lines of code in your application for different pages without repeating the lines of code in every place, in this case you can create a directive with that code in separate file and call that directive where that code is needed. This is the better way to understand code. These are the types of custom directives:

To use directive as an element you have to write element tag. If you want to use some code, then you just need to use that tag.

In the above example we have created a directive defined by myapp.directive. It is named as userReviews that is the element tag name used in html. user-reviews is different from userReviews because hyped in user-reviews is converted into camel case written as userReviews in javascript file. then it has a function which returns restrict: ‘E’ that means custom element directive and templateUrl that has the path of the code file inside element tag.

It works same as element directive, the only difference is that it returns attribute tag.

Understanding Custom Directives in AngularJS