Note that there are some explanatory texts on larger screens.

plurals
  1. POWhat is an AngularJS directive?
    text
    copied!<p>I have spent quite a lot of time reading through AngularJS documentation and several tutorials, and I have been quite surprised at how unapproachable the documentation is.</p> <p>I have a simple, answerable question that may also be useful to others looking to pick up AngularJS:</p> <p><strong>What is an AngularJS directive?</strong></p> <p>There should be a simple, precise definition of a directive somewhere, but the <a href="https://angularjs.org/#create-components" rel="noreferrer">AngularJS website</a> offers these surprisingly useless definitions:</p> <p><a href="https://angularjs.org/#create-components" rel="noreferrer">On the home page</a>:</p> <blockquote> <p>Directives are a unique and powerful feature available in AngularJS. Directives let you invent new HTML syntax, specific to your application.</p> </blockquote> <p>In the <a href="http://docs.angularjs.org/guide/directive" rel="noreferrer">developer documentation</a>:</p> <blockquote> <p>Directives are a way to teach HTML new tricks. During DOM compilation directives are matched against the HTML and executed. This allows directives to register behavior, or transform the DOM.</p> </blockquote> <p>And there is a <a href="http://blog.angularjs.org/2012/11/about-those-directives.html" rel="noreferrer">series of talks</a> about directives which, ironically, seem to assume the audience already understands what they are.</p> <p>Would anyone be able to offer, for clear reference, a precise definition of what a directive is that explains:</p> <ol> <li>What it is (see the clear <a href="http://jquery.com/" rel="noreferrer">definition of jQuery</a> as an example)</li> <li>What practical problems and situations it is intended to address</li> <li>What design pattern it embodies, or alternatively, how it fits into the purported MVC/<a href="https://plus.google.com/104744871076396904202/posts/DRUAkZmXjNV" rel="noreferrer">MVW</a> mission of AngularJS.</li> </ol>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload