Angular directives create custom attributes for DOM elements. A directive can modify the
behavior of the element in which it is specified. Do not use directives to add elements to the
DOM; instead, use widgets
to add DOM elements.
Following is the list of built-in Angular directives:
ng:autobind
- An Angular bootstrap parameter that can
act as a directive.ng:bind
- Creates a data-binding between an HTML text value
and a data model.ng:bind-attr
- Creates a data-binding in a way similar
to ng:bind
, but uses JSON key / value pairs to do so.ng:bind-template
- Replaces the text value of an
element with a specified template.ng:change
- Executes an expression when the value of an
input widget changes.ng:class
- Conditionally set a CSS class on an element.ng:class-even
- Like ng:class
, but works in
conjunction with angular.widget.@ng:repeat
to affect even rows in a collection.ng:class-odd
- Like ng:class
, but works with angular.widget.@ng:repeat
to affect odd rows.ng:click
- Executes custom behavior when an element is
clicked.ng:controller
- Creates a scope object linked to the
DOM element and assigns behavior to the scope.ng:hide
- Conditionally hides a portion of HTML.ng:href
- Places an href in the Angular namespace.angular.directive.ng:init
- Initialization tasks run before a template is executed.ng:show
- Conditionally displays a portion of HTML.ng:src
- Places a src
attribute into the Angular namespace.ng:style
- Conditionally set CSS styles on an element.angular.directive.ng:submit
- Binds Angular expressions to onSubmit
events.For more information about how Angular directives work, and to learn how to create your own directives, see Understanding Angular Directives in the Angular Developer Guide.