Veri hazır olduktan sonra Yükleyici nasıl kapatılır

Question

Benim Ionic 2 uygulamasında, bir veriyi almak için bir http GET yapan bir hizmeti tüketen bir bileşene sahibim. Bileşenim daha sonra bu servisi çağırır ve veri mevcut olduğunda onu ayarlar ve sunar. Benim bileşeni uyumsuz veri getirir

export class FarmList implements OnInit { 

    items: Object; 


    constructor(public testService: TestService, public nav: NavController){ 
    } 

    ngOnInit(){ 

    this.getData() 
    } 

    getData(){ 

    let loading = Loading.create({ 
     content: 'Please wait..', 
     spinner: 'crescent' 
    }) 

    this.nav.present(loading) 

    this.testService.fetchData().then(data => this.items = data) 

    } 
... 

} 

, ben bir loader eğirme sahip çalışıyorum ve veri mevcut gelince de loader gizlenmek istiyorum:

O aşağıdaki gibi görünüyor.

Ancak, benim şimdiki koduyla spinner veriler ve ekran görüntüsü görülebilir olarak görüntülenen sonra bile iplik tutar:

getData() servis çağrı yapan yöntemidir. Bunu nasıl düzeltebilirim? Yükleyiciyi uygulamak için doğru yol mu?

Answer 1

working plunker here.

o plunker kodunda görebilirsiniz gibi, düzgün kod çalışması amacıyla birkaç değişiklik yapacak:

export class FarmList implements OnInit { 

    items: Object; 

    // Define the loading var here, so we can access later when the information is ready 
    loading : any; 

    constructor(public testService: TestService, public nav: NavController){ 
    } 

    // Instead of 'ngOnInit', I would use 'ionViewWillEnter' 
    ionViewWillEnter(){ 
    this.getData() 
    } 

    getData(){ 

    this.loading = Loading.create({ 
     content: 'Please wait..', 
     spinner: 'crescent' 
    }) 

    this.nav.present(this.loading) 

    this.testService.fetchData().then(data => { 
             this.items = data; 

             // After we get the data, we hide the loading 
             this.hideLoading()}); 

    } 

    // I 've added this method so we can grab the loading var and use it 
    // to hide the loading component. 
    private hideLoading(){ 
    this.loading.dismiss(); 
    } 
... 

} 

============= ===================

Update: İyonik 2.0.0-beta.8 salım olarak

(2016-06-06 changelog:

onPageWillEnter, ionViewWillEnter