Now a day’s most of the users showing interest in single page applications, suddenly a doubt strikes in your mind, what is single page application (SPA)?
So let me explain in detail about single page apps, Google employee started the work on angularjs, idea turns very well and now Google officially providing support to angular js.

Angularjs uses mvc framework, mvc means (model, view and controller).
To develop Angular applications (spa) you need to have basic knowledge in
JavaScript
Html
Css
Now let me walk through features of angularjs

Data Binding: In Angularjs data binding plays a major important role, here data synchronization done automatically between model and view components.

Controllers: It is nothing but JavaScript constructor function, which is used to argument angular scope.

Services: There are two types of services
1. Lazily instantiated
2. Singletons
 If the component there in the application, then angular service will be initiated.
 Each and every component dependent on a service get reference to single instance is generated by a service factory.
Example service: $http
How to create a angular service?
First we need to create a JavaScript file name as app.js
Within the file write below code to create your first service.

Var app=angular.module (‘myfirstservice’ [ ]);
Myfirstservice.factory (‘serviceid’, function ()
{
Var servicename;
  //here factory function body 
Return servicename;
}

Scopes: Scope is used to joining application controller and view, in template linking phase the directives set up expressions on the scope.
Example: Now I will display textbox value using scope.

Var app=angular.module(‘scopevalue’ [ ])
                   .controller(‘myfirstcontroller’ ,[ ‘$scope’, function ($scope)
                {
                  $scope.displayvalue = function()
                            {
                             $scope.uservalue= $scope.username;
                            };
                }]);

Now let’s see html code below

<div ng-controller="MyfirstController">
  Your name:
    <input type="text" ng-model="username">
    <button ng-click='displayvalue()'>submit</button>
  <hr>
  {{uservalue}}
</div>

Dependency Injection :
Components get hold of their dependencies is known as dependency injection, angular injection subsystem creates components which resolve dependencies, and provides other components as requested.
Now let’s check small example below
Above we create a service to display textbox value, now we use injector how to build a service.

Myfirstservice.factory (‘uservalue’, function ($window)
{
Return
 {
    Name: function (text)
      {
      $window. Alert (text);
      }
  };
});

Now we will create a new injector that will provide components defined in our myfirstservice, and request the uservalue service from the injector.

Var injector=angular. Injector ([‘myfirstservice’,’ng’]);
Var uservalue=injector. Get (‘uservalue’);

Angularjs directive template function example next feature.

Thanks for reading this article.