In AngularJS, all the directives match the tag, element, or attributes name. The subsequent code demonstrates the varied ways in which a directive may be documented from a template. For example,
<my-custom-directive></my-custom-directive> < !- - OR - -> <span my-custom-directive></span> < !- - OR - -> <span class="my-custom-directive"></span>
It is good practice to use tag names and attributes for directives instead of using elements and class names. Doing this typically makes it easier to see which directives matches a given element.
The following code example shows different options to invoke the directives:
<input type="text" ng-model=" my-Custom-Directive" placeholder="name" /> <span ng-bind=" my-Custom-Directive"></span> ...