AngularJS

AngularJS is an open source web application framework. It was originally developed in 2009 by Misko Hevery and Adam Abrons. It is now maintained by Google.

---

AngularJS extends HTML

AngularJS extends HTML with ng-directives.

1)      The ng-app directive defines an AngularJS application.

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

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

Example -

<div ng-app="">
  <p>Name : <input type="text" ng-model="name"></p>
  <p ng-bind="name"></p>
</div>

The ng-init directive initializes AngularJS application variables.

<div ng-app="" ng-init="firstName='Manoj'">
   <p>The name is : <span ng-bind="firstName"></span></p>
</div>

Alternatively with valid HTML:

<div data-ng-app="" data-ng-init="firstName='manoj'">
   <p>The name is : <span data-ng-bind="firstName"></span></p>
</div>

AngularJS expressions are written inside double braces: {{ expression }}.

<div ng-app="">

 <p>Expression:: {{ 5 + 5 }}</p>
</div>

AngularJS modules define AngularJS applications.

AngularJS controllers control AngularJS applications.

The ng-app directive defines the application, the ng-controller directive defines the controller.

<div ng-app="myApp" ng-controller="myCtrl">

First Name <input type="text" ng-model="firstName"><br>

Last Name <input type="text" ng-model="lastName"><br>
<br>

Full Name : {{firstName + " " + lastName}}

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.firstName= "Manoj";
    $scope.lastName= "Kumar";
});
</script>