Just Create a simple Html page like the following..
<html>
<head>
<script src="~/Scripts/Angularjs/angular.min.js"></script>
</head>
<body>
<form>
<input type="number" required />
<input type="submit" />
Hello {{1 + 1}} the World!
</form>
</body>
</html>
If u see this code in browser then you will see the output like
Now if u add ng-app anywhere so that the Hello {{1 + 1}} the World! becomes the child of that element, what happens then?
There is your first Angular magic! You can see that the {{1 + 1}} expression got evaluated and replaced with “2″. So, what happened here is that the page was downloaded and then Angular scanned the page for ng-app and processed any expressions that it found (in this case just the {{1 + 1}} expression) and replaced the content with the evaluated expression. If you would like to prove to yourself that the location of ng-app matters, try moving ng-app onto a div that does not include the {{1 + 1}} expression and you will see that the expression does not get evaluated (but any expressions inside the ng-app div do).
<body ng-app>
<form>
<input type="number" required />
<input type="submit" />
Hello {{1 + 1}} the World!
</form>
</body>
and the output is
So this is how the AngularJs works. It's pretty simple
<html>
<head>
<script src="~/Scripts/Angularjs/angular.min.js"></script>
</head>
<body>
<form>
<input type="number" required />
<input type="submit" />
Hello {{1 + 1}} the World!
</form>
</body>
</html>
If u see this code in browser then you will see the output like
Now if u add ng-app anywhere so that the Hello {{1 + 1}} the World! becomes the child of that element, what happens then?
There is your first Angular magic! You can see that the {{1 + 1}} expression got evaluated and replaced with “2″. So, what happened here is that the page was downloaded and then Angular scanned the page for ng-app and processed any expressions that it found (in this case just the {{1 + 1}} expression) and replaced the content with the evaluated expression. If you would like to prove to yourself that the location of ng-app matters, try moving ng-app onto a div that does not include the {{1 + 1}} expression and you will see that the expression does not get evaluated (but any expressions inside the ng-app div do).
<body ng-app>
<form>
<input type="number" required />
<input type="submit" />
Hello {{1 + 1}} the World!
</form>
</body>
and the output is
So this is how the AngularJs works. It's pretty simple
No comments:
Post a Comment