At the heart of Angular framework is a parser. A parser which parses the Angular directives and render’s HTML output.
Angular parser works in three steps:
Step 1: HTML browser parses the HTML and creates a DOM (Document Object Model).
Step 2: Angular framework runs over this DOM looks at the Angular directives and manipulates the DOM accordingly.
Step 3: This manipulated is then rendered as HTML in the browser.
Now the above Angular parsing is not so simple as it looks to be. It occurs in two phases Compile and Link. First, the compile phase occurs then the link phase.
In compile phase, the Angular parser starts parsing the DOM and whenever the parser encounters a directive, it creates a function. These functions are termed as template or compiled functions. In this phase, we do not have access to the $scope data.
In the link phase, the data i.e., ($scope) is attached to the template function and executed to get the final HTML output.