2016-12-15 15 views
0

Nativescript角度ActivityIndi​​cator

export class MyComponent { 

    public refreshing = false; 

........ 
} 

その後、私は私のバックエンドからいくつかのデータをフェッチ:

public onRefreshTap() { 
    console.log("onrefreshtap"); 
    this.refreshing = true; 
    this.backend.getData(function (data) { //this.backend is my Service 
     this.refreshing = false; 
    }) 
} 

proble私はthis.refreshingをtrueにすると、ActivityIndi​​catorが正しく表示されます。しかし、bakendリクエストが完了すると、this.refreshing = falseを設定すると、ActivityIndi​​catorは非表示になりません(また、ビジー状態のプロパティは更新されず、回転状態にとどまります)。

何が間違っているのですか?事前

答えて

0

ありがとうございますまた、それは以下のサンプルコードで示されているようrefreshingプロパティにアクセスしようとすることができます。それは、あなたのサービスのコールバックメソッド内のプロパティにアクセスする際の問題かもしれません。

public onRefreshTap() { 
    var that = this; 
    this.refreshing = true; 
    this.backend.getData(function (data) { //this.backend is my Service 
     that.refreshing = false; 
    }) 
} 

または

public onRefreshTap() { 
    this.refreshing = true; 
    this.backend.getData((data) => { 
     that.refreshing = false; 
    }) 
} 
0

それは多くのことがあります
1)falseに変更、観察可能で、コンポーネントによって "見" されていません。
------ソリューションはゾーン内でコードを実行します(https://angular.io/docs/ts/latest/api/core/index/NgZone-class.html参照)

2)バックエンドはエラーを返しています(私はコードでそれを扱っていません)。
------解決策は、エラーに対処するための関数です。

3)コールバックが呼び出されていません。あなたのコードでは、です。backendServiceにパラメータとして関数を送信しています。サービスがそれを実行していない可能性があります。
------返品された値を処理するためにPromissesまたはObservablesを使用してみてください(私はまだそれを学んでいるので、私の説明は最悪になります)。 :)

はここに働くかもしれないいくつかのコードです:

私-component.html

<ActivityIndicator [busy]="isWorking" [visibility]="isWorking?'visible':'collapse'"></ActivityIndicator> 



私-component.ts

import { Component, NgZone } from "@angular/core"; 

    ... 

export class MyComponent { 
    isWorking:boolean = false; 
    constructor(private backendService: BackendService, 
       private _ngZone: NgZone) 
    { 
     this.isWorking = false; 
    } 

    public onRefreshTap() { 
     console.log("onrefreshtap"); 
     this.isWorking = true; 
     this.backendService.getData() 
      .then( 
       // data is what your BackendService returned after some seconds 
       (data) => { 
        this._ngZone.run(
         () => { 
          this.isWorking = false; 

          // I use to return null when some Server Error occured, but there are smarter ways to deal with that 
          if (!data || data == null || typeof(data)!=='undefined') return; 

          // here you deal with your data 
         } 
        ) 
       } 
     ); 
    } 

} 
関連する問題