How does the browser recognize angularjs tags in html?
Asked Answered
S

5

7

We know that html is the client side scripting, while using angularjs framework in html we include "ng" in html tags.My Question is how the browser recognize or identifies the html tags which has "ng".please give the right solution for my question.

Snapshot answered 20/2, 2015 at 5:5 Comment(1)
The browser does not understand these tags. It is the angular.js library which reads and understands them.Baldheaded
N
3

Below point helped me in understanding "How angularjs tags are understood by the browser":

  • AngularJS's HTML compiler allows the developer to teach the browser new HTML syntax. The compiler allows you to attach behavior to any HTML element or attribute and even create new HTML elements or attributes with custom behavior. AngularJS calls these behavior extensions directives.

For detailed information on how HTML compiler works, please follow the below link: https://docs.angularjs.org/guide/compiler

Nitrification answered 8/11, 2017 at 15:22 Comment(0)
R
3

Angular 1 needs the angular.js file to be included in the index.html so that it will translate the directives to browser understandable form.

While in the angular2 the typesscript is used, in which the type script compiler compiles or translates the typescript code into the browser understandable javascript/ecmascript automatically which will be rendered on screen.

The angular js will run on the fly in the browser while angular 2 and above needs the precompilation or can be said as translation to javascript/ecmascript. Also if the translation is mentioned with a production build flag the translated javascript/ ecmascript will be a minified one.

Roxannroxanna answered 8/11, 2017 at 15:43 Comment(0)
C
0

The browser does not have angular/ng support built in.1 The angular library (the angular.js script) must be included on the page, and that's where the magic happens.


1 though Google would like to change that.

Conics answered 20/2, 2015 at 5:7 Comment(0)
M
0

Angular aims to teach the browser a few new things and in the process, making the browser a little smarter than it is without angular.

When you start an angular application, angular transverses the DOM quickly, looking for directives (example ng-options, ng-if, etc). This DOM transversal is done by the $compile service. After traversing the DOM and identifying the directives, angular links them to their respective views and bind them to there scope.

These directive encapsulate the HTML that the browser understands and they are exposed to the browser after the compilation process.

Mcmorris answered 20/2, 2015 at 5:31 Comment(0)
P
0

We use ng-app directive to bootstrap the application as an angular application.Once you have this directive (ng-app="myApp") in your HTML root element all the nested ng elements are identified and are compiled .

for example

   angular.module('myApp', []);//module definition in JS File

   <body ng-app="myApp">
   <div ng-controller="myCntrl">
        <input type="text" ng-model="User"/> //this will be recognized and compiled 
    </div>

I hope this is what you were looking for.

Pusillanimous answered 20/2, 2015 at 5:42 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.