Angular 2
Zone.js
Поиск…
Получение ссылки на NgZone
NgZone
может быть введена через Injection Dependency (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
});
}
}
Использование NgZone для выполнения нескольких HTTP-запросов перед показом данных
runOutsideAngular
можно использовать для запуска кода вне углового 2, чтобы он не runOutsideAngular
ненужное изменение. Это можно использовать, например, для запуска нескольких HTTP-запросов для получения всех данных перед их рендерингом. Чтобы снова выполнить код внутри Angular 2, можно run
метод NgZone
.
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
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow