Angular 2
Zone.js
Buscar..
Obtener referencia a NgZone
NgZone
referencia de NgZone
se puede inyectar a través de la inyección de dependencia (DI).
my.component.ts
import { Component, NgOnInit, NgZone } from '@angular/core';
@Component({...})
export class Mycomponent implements NgOnInit {
constructor(private _ngZone: NgZone) { }
ngOnInit() {
this._ngZone.runOutsideAngular(() => {
// Do something outside Angular so it won't get noticed
});
}
}
Uso de NgZone para realizar múltiples solicitudes HTTP antes de mostrar los datos
runOutsideAngular
se puede usar para ejecutar código fuera de Angular 2 para que no active la detección de cambios innecesariamente. Esto se puede usar para, por ejemplo, ejecutar varias solicitudes HTTP para obtener todos los datos antes de representarlos. Para ejecutar código de nuevo en el interior angular 2, run
el método de NgZone
se puede utilizar.
my.component.ts
import { Component, OnInit, NgZone } from '@angular/core';
import { Http } from '@angular/http';
@Component({...})
export class Mycomponent implements OnInit {
private data: any[];
constructor(private http: Http, private _ngZone: NgZone) { }
ngOnInit() {
this._ngZone.runOutsideAngular(() => {
this.http.get('resource1').subscribe((data1:any) => {
// First response came back, so its data can be used in consecutive request
this.http.get(`resource2?id=${data1['id']}`).subscribe((data2:any) => {
this.http.get(`resource3?id1=${data1['id']}&id2=${data2}`).subscribe((data3:any) => {
this._ngZone.run(() => {
this.data = [data1, data2, data3];
});
});
});
});
});
}
}
Modified text is an extract of the original Stack Overflow Documentation
Licenciado bajo CC BY-SA 3.0
No afiliado a Stack Overflow