javascript - 为什么事件指示器不隐藏在 native 脚本中？

Question

我在我的页面中使用了事件指示器，但当我在任何 promise 中将其设置为 false 时，它​​不会隐藏，但当我在外部 promise 中设置 false 时，它​​会隐藏

//My ts file
 public loadLanguages() {
   this.isLoading= true; //where i am setting value true for activity indicator
    for (var i = 0; i < 1; i++) {
        this.ArrayLangauge.push("Select Langauge");
    }
    this.registerService.language()
        .then(a => {
            if (a) {
                for (var i = 0; i < a[0].languages.length; i++) {

                }
            } this.isLoading=false; ////where i am setting value false for activity indicator
        });
}


//my Html
  <AbsoluteLayout height="100%" width="100%">
    <ActivityIndicator class="indicator" [busy]="isLoading"  [visibility]=" isLoading ? 'visible' : 'collapse'" row="1" horizontalAlignment="center" verticalAlignment="center"></ActivityIndicator>    
</AbsoluteLayout>

Answer 1

使用Http服务并返回Observable:

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import "rxjs/Rx";
import { RequestOptions, Headers } from '@angular/http';

@Injectable()
export class RegistrationService {

    constructor(private http:Http, private apiCalls:ApiCalls) {
    }

    language():Observable<any> {
        var myurl = this.apiCalls.BASE_URL + "languages";
        return this.http.get(`${myurl}`)
            .map(this.extractData)
            .catch(this.handleError);
    }

    private extractData(res:Response) {
        let body = res.json();
        return body;
    }

    private handleError(error:Response | any) {
        // In a real world app, we might use a remote logging infrastructure
        console.log(JSON.stringify(error.json()));
        return Observable.throw(error);
    }

}

在您的组件上，您可以执行以下操作:

this.isLoading = true;
this.registrationService.language(this.user)
            .subscribe((data) => {
                    console.log("success =>" + JSON.stringify(data));
//handle data as you like here
                    this.isLoading = false;


                },
                (error:any) => {
                    console.log("error =>" + JSON.stringify(error));
                    console.log(error.status);

                        this.isLoading = false;


                }
            )

在您的 html 模板上:

<ActivityIndicator [busy]="isLoading" horizontalAlignment="center" verticalAlignment="center" [visibility]="isLoading? 'visible':'collapse'"></ActivityIndicator>