Question

我正在学习离子，所以一旦点击了注册按钮，如何显示加载符号并在离子3中获得响应后隐藏它？

sign.html

<button ion-button color="danger" block outline (click)="signup()">Signup</button>

signup.ts

signup() {
    this.authServiceProvider.postData(this.userData, "signup").then((result) => {
    this.responseData = result;
    console.log(this.responseData);
    if( (JSON.stringify(this.responseData._body)) != "" ) {
        this.navCtrl.setRoot(HomePage);
    } else {
        console.log("User already exists");
    }
    }, (err) => {
        //connection failed error message
        console.log("something went wrong");
    });
}

Answer 1

首先，您需要导入加载控制器。

import { LoadingController } from 'ionic-angular';

在构造函数中，您需要创建它的对象。如

constructor(public loadingCtrl: LoadingController){}

现在，在使用注册方法调用服务之前，需要激活加载消息，然后在结果之后解除它。

signup() {
 let loading = this.loadingCtrl.create({
      content: 'Please wait...'
    });
    loading.present();
    this.authServiceProvider.postData(this.userData, "signup").then((result) => {
    this.responseData = result;
    console.log(this.responseData);
    if( (JSON.stringify(this.responseData._body)) != "" ) {
     loading.dismiss();        
     this.navCtrl.setRoot(HomePage);
    } else {
        loading.dismiss();
        console.log("User already exists");
    }
    }, (err) => {
        //connection failed error message
        console.log("something went wrong");
    });
}

Ionic 3在http请求上显示加载符号

1 个答案: