Developer Guide: Angular HTML Compiler: Directives: Creating Custom Angular Directives

Work in Progress This page is currently being revised. It might be incomplete or contain inaccuracies.

The following code snippet shows how to define a custom directive. You define a new directive by extending the Angular HTML compiler. The code snippet below is a simplified definition of the built-in ng:bind directive:

angular.directive('ng:bind', function(expression, compiledElement) {
    var compiler = this;
    return function(linkElement) {
        var currentScope = this;
        currentScope.$watch(expression, function(value) {
            linkElement.text(value);
        });
    };
});

Additional Compiler Methods for Custom Directives

The angular compiler exposes methods that you may need to use when writing your own widgets and directives. For example, the descend() method lets you control whether the compiler ignores or processes child elements of the element it is compiling. For information on this and other compiler methods, see the Compiler API doc.

Related Docs

Related API