Angular 2 - ¿Dónde está el servicio $timeout?

Sep 28, 2015 9:00:00 AM / by daniel.comas

 

Al empezar con Angular 2 la mayoría de veces buscaréis como se hacen la cosas que ya hacíais préviamente con la versión 1.X. En este caso el referente al servicio $timeout. Este artículo pretende que conozcáis no sólo ésto sino además abriremos la caja de pandora de las entrañas de esta nueva versión!

 

Angular 1.X (Digest Cycle)

En angular 1 estamos ligados a adaptarnos al ciclo de digest. Por si no habéis visto el código del servicio $timeout podéis hecharle un vistazo (Ver Código Timeout Angular 1.X), veréis a lo que me estoy refiriendo!

 

angular.module("Xapp", []);

myapp.controller("Xcontroller", function($scope, $timeout){
$timeout(function() {
console.log("fired");
}, 3000);
});

 

Angular 2 (Zone.JS) = Javascript puro

En ésta nueva versión utilizaremos la ya conocída setTimeout, no existe un servicio como tal ya que con Angular 2 no nos tenemos que preocupar de los digest de la primera versión. Eso es porque se incorpora una nueva librería la llamada Zone.JS que nos realiza la magia. Para que entendáis como trabaja, permite crear un contexto (guardando el estado de las variables) en cada proceso asincrónico que se ejecute. 

En esta url podéis encontrar información de primera mano de la finalidad de Zone.JS: Zone.JS How it works?

 

 

 

Por lo tanto podremos utilizar el setTimeout de toda la vida:

 

import {Component, View, bootstrap} from 'angular2/angular2';

@Component({
selector: 'app'
})
@View({
template: 'module_151811850626664'
})
class App {
name: string;
constructor() {
setTimeout(() => {
//We have access to the context values
this.name = 'ingens'
}, 0);
}
}

bootstrap(App);

 

Comentar también que esta versión ha sido creada y diseñada para que nos parezca más un conjuntos de utilidades, es decir una librería ES6/ES7 que no un Framework JS.

 

 

Topics: AngularJS, Async, Digest, Ingens Developments, JavaScript, Programación, TypeScript, Zone.js

daniel.comas

Written by daniel.comas

Lists by Topic

see all
Servicios gestionados

Categorías

Ver todas