Skip to content
Angelo edited this page Feb 11, 2014 · 19 revisions

Native Directive

Completions

Completion for directive name

Completion for directive name :

Completion for directive name

You can configure directives syntax in order to that completion shows you the well directive names (ng-, ng_, etc).

Completion by tags

Some directive supports only some HTML elements. For instance ngModel can be used only for 'inpu' HTML element. The completion shows ngModel only for 'input' element.

Completion by restrict

Angular defines 4 restricts :

  • A : the directive is available for attribute. Completion for directive parameter
  • C : the directive is available for class attribute value.
  • E : the directive is available for element. Completion for directive as element
  • M : the directive is available for comment.

AngularJS Eclipse supports AE for the moment.

Completion for directive parameters

Some directive have parameters. A good sample is the ngPluralize directive which defines required parameters like 'count', 'when' and optional 'offset' parameter:

Completion for directive parameter

If you open completion inside HTML element, you will see ngPluralize :

Completion for directive parameter

When you apply the completion on ngPluralize, 'count' and 'when' attribute are generated because there are required :

Completion for directive as element applied

Directive parameters are highlighted with a light blue color.

If you open completion inside the HTML element, you can see 'offset' directive parameter :

Completion for directive parameter

ngPluralize can be used as element (restrict=EA), you can benefit too with completion for HTML element.

Completion for directive as element

When you apply the completion on ngPluralize, 'count' and 'when' attribute are generated because there are required :

Completion for directive as element applied

Hover

Hover for directive name

Custom Directive

Completions

Completion for custom directive name :

Completion for custom directive name

Hyperlink

Hyperlink for custom directive name :

Hyperlink for custom directive name