AngularJS: Services

Services

TYPE of Services

SetTimeout & setInterval

Using functions

Using services

In the JS file use it as:
   $interval (  functionName, 2000 );



$timeout.cancel(<fuction>)

UI Services

$location -> moves to a specific ID element

$anchorScroll -> moves the web pages to a specific part

Ex. 

      $location.hash( "IDelement" );

      $anchorScroll();

       

Register a Service

Custom services

In another file

• Create the services using a IIFE function

( function() {

var github = function(){

     var getUser = function(user ){

     };

      var anotherFunction = function(){

     };

     return{

           getUser : getUser ,

           anotherFunction:  anotherFunction ;

     };

}; // End of the service

• Invoke the module where the service will be used
• This line should be in the IIFE function

     var module = angular.module( " moduleName " );

• Register the service

       module.factory( "github", github );

}());

Implementing Service in Controller

var mainController = function($scope, $http, github ) {
$scope.title = mainService.main.title;
}

$resource

• To request Restful web services

In the Service

(function() {
var app = angular.module('app');
app.factory("performanceLevelService", function($resource, $http) {
var restPerformanceLevel = $resource('/api/v1/performanceLevel/:id', {
id : '@id'
}, {
'update' : {
method : 'PUT'
}
}
);
return {
getEvaluation : function(id) {
return restPerformanceLevel.get({
id : id
});
}
}
});
}());

In the Controller

$scope.performanceLevelService = performanceLevelService .getEvaluation(evaluationService.js);

• To write in the disk

var resource = $resource('/data/event:id', {id: '@id'} )

• id is part of the attributes of event

resource.save(event);

$anchorScroll

Go to an specific ID element putting in the URL   ##<Id>

$anchorScroll();

$cacheFactory

app.factory('mycache', function($cacheFactory){

      return $cacheFactory('mycache', {capacity:3});

• or withour any limit

     return $cacheFactory('mycache');

})

• In the controller

app.controller('MyCacheController', function CacheSample($scope){

     

       $scope.addToCache = function(key, value){

           mycache.put(key, value);

     };

    $scope.readCache = function(key){

           mycache.get(key);

     };

    $scope.getCacheStatus = function(key, value){

           mycache.info();

     };

});

Exceptions

• In the service

app.factory('MyException', function(){

    return function (exception){

          console.log('Error in ' + exception.message);

   };

})

• In the controller

throw {message : 'error message'}

$cookieStore

$cookieStore.put(key, value);

$cookieStore.get(key);

$cookieStore.remove(key);

$rootScope

Can be used to put global variables, it contains all the $scope created by any controller

$window

$document

$rootElement