What does a returned function do in the directive declaration

Question

I'm learning about directive creation in AngularJS.

In the official docs, it says:

Best Practice: Prefer using the definition object over returning a function.

But it never gives an example of returning a function. It always gives examples returning a definition object.

Question: What does a directive do when you return a function instead of a definition object?

It's the postlink function... Check out this answer... http://stackoverflow.com/a/14565177/3199781 — Anthony Chu, Aug 14 '14 at 17:24

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

Yeah, the directive documentation doesn't mention anything about returning a function.

But, this $compile documention does say:

Comprehensive Directive API

There are many different options for a directive.

The difference resides in the return value of the factory function. You can either return a "Directive Definition Object" (see below) that defines the directive properties, or just the postLink function (all other properties will have the default values).

And there is an example below (see the comment at the bottom).

var myModule = angular.module(...);

myModule.directive('directiveName', function factory(injectables) {
  var directiveDefinitionObject = {
    link: function postLink(scope, iElement, iAttrs) { ... }
  };
  return directiveDefinitionObject;
  // or
  // return function postLink(scope, iElement, iAttrs) { ... }
});

What does a returned function do in the directive declaration

1 Answers1