Developer Guide: Angular HTML Compiler: Understanding How the Compiler Works

The compiler is responsible for applying directives to the HTML. The directives extend the behavior of HTML elements and can effect the DOM structure, presentation, and behavior. This allows Angular to teach the browser new tricks.

The compilation starts at the root element and proceeds in a depth-first order. As the compiler visits each node it collects the directives, orders them by priority and executes their compile function. The result of the compilation process is a linking function. The linking function can be used on the template clones to quickly bind the directives with the scope.

The result of the compilation process is a live view. We say 'live' since any changes to the model attached to the scope are reflected in the view, and any changes in the view are reflected in the scope. This makes the scope the 'single source of truth'.

Since directives allow attachment of behavior to the HTML, the angular philosophy is to use the HTML as Domain Specific Language (DSL) when building an application. For example it may be useful to declare TabPanel directive, or KeyboardShortcut directive when for an application.

For details on how directives are created see directives

Related Topics

Related API