which directives are used in which component templates).
Make connections between decorated classes (e.g. Scan every file in the project for decorated classes, and build a model of which components, directives, pipes, NgModules, etc. Create an instance of the TypeScript compiler, with some additional Angular functionality. The main flow of Angular compilation proceeds as follows: The main goal of ngc is to compile TypeScript code while transforming recognized Angular decorated classes into more efficient representations for run time. Let’s examine how ngc manages each of these goals. Re-compile quickly when the developer makes a change. Apply TypeScript’s type-checking rules to component templates. Compile Angular decorators, including components and their templates. In this way, ngc can be considered an extended TypeScript compiler which also knows how to “execute” Angular decorators, applying their effects to the decorated classes at build time (as opposed to run time). Let’s go through the compile and link API’s.The decorator has been replaced with several static properties ( ɵfac and ɵcmp), which describe this component to the Angular runtime and implement rendering and change detection for its template. 
If there is a one-time activity common to all instances of the directive. Their own compilation and linking are suspended until that occurs. Child elements that contain templateUrl directives will not have been compiled and linked since they are waiting for their template to load asynchronously. Link function is used to perform DOM manipulation and copy content into the DOM from the scope.
The above code is the exact copy of AngularJS compile docsĬompile function does the one-time activity and could be used to do some initialization. var element = linkFn ( scope ) // Step 4: Append to DOM (optional) parent. element ( html ) // Step 2: compile the template var linkFn = $compile ( template ) // Step 3: link the compiled template with the scope. DOM element where the compiled template can be appended var html = ' ' // Step 1: parse HTML template into DOM element var template = angular.
0 kommentar(er)
