The Service in Angularjs: Tips and Examples

AngularJS supports the concepts of "Seperation of Concerns" using the service structure. Service is JavaScript functions and is responsible for certain tasks. It makes them separate entities that are easy to maintain and test. Controller, filter can call them simply. Service is often injected using AngularJS's dependency injection mechanism.

AngularJS provides a lot of predefined services: $ http, $ scope, $ route, $ window, $ location. Each service has certain tasks. As an example,, $ http helps create ajax requests on the server to retrieve data. $ route helps define routing information. The default AngularJS service starts with the $ symbol.

There are two ways to create a service:

• factory
• service

Use factory method in AngularJS

When using the factory method, we first define the factory and attach the method to it.

 var ungdungAngularJS = angular . module ( "ungdungAngularJS" , []); ungdungAngularJS . factory ( 'toanhocService' , function () { var factory = {}; factory . phepnhan = function ( a , b ) { return a * b } return factory ; }); 

Use service method in AngularJS

Using the service method, we will define the service then assign the method to it. We also inject the services available to it.

 ungdungAngularJS . service ( 'tinhBPService' , function ( toanhocService ) { this . binhphuong = function ( a ) { return toanhocService . phepnhan ( a , a ); } }); 

As an example,:

Below is an example to illustrate the above instruction.

testAngularJS.jsp

 Vi du Service in AngularJS  src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js" > 

 Cavalier AngularJS  ng-app = "ungdungAngularJS" ng-controller = "tinhBPController" > 

 So much:  type = "number" ng-model = "number" />  ng-click = "binhphuong ()" > X 2 

 Pass through: {{ketqua}}