Hunza-Pakistan

Tuesday, August 2, 2022

Learning AngularJS step by step!

Introduction:

AngularJS is a very popular Framework which is written in JavaScript. AngularJS is normally available as a JavaScript file,  whichcan be added to any of your  web page with the following script tag:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

AngularJS extends the functionality of  HTML with  the following ng-directives.

1. ng-app directive:

The ng-app directive defines an AngularJS application.

2. ng-model directive:

The ng-model directive binds the value of HTML controls (input, select, textarea) to application data.

3. ng-bind directive:

The ng-bind directive binds application data to the HTML view.

4. ng-init directive: 

The ng-init directive initializes AngularJS application variables.

5. AngularJS Expressions:

In AngularJS expressions  are written inside double Curly Brackets (Braces)

The following example script illustrates the uses of above mentioned directives and Expressions:

<!DOCTYPE html> //This indicates the start of an HTML file
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app=""> //Here the ng-app directive is used to indicate that this div will have AngularJS Application code
  <p>My first expression: {{ 88 + 5 }}</p> //Here in this paragraph, the 88+5 expression is inserted with double curly brackets.
</div>

</body>
</html>

0 comments:

Post a Comment