nailujpeloz
nailujpeloz

Reputation: 57

How can I reload page using Ionic 2

Hi everyone I have a problem with my login form on Ionic 2. When I do login token is saved on storage and redirect to another page, but user's data is not shown on Android or IOS because token is not available. I discover that I need to reload the page, on local environment 'location.reload()' works perfect and user's data is available but does not work when I pusblish on Google Play and App Store.

I've tried some ways to reload it but does not work on Android and IOS. What can I do?

Login function

loginForm(){
const data = {
  "username" : this.login.value.username,
  "email" : this.login.value.username,
  "password" : this.login.value.password,
}
this.dataService.loginUser(data).subscribe(
    (data) => {
      let token = data.key;
      this.dataService.checkAccessUserGroup(token).subscribe(
        (data) => {
          if(data[0] == 200){
            this.storage.set('access_token', token);
            //this.appCtrl.getRootNav().setRoot(HomePage);
            //this.navCtrl.setRoot(HomePage);
            //this.appCtrl.getRootNav().setRoot(this.navCtrl.getActive().component);
            //this.navCtrl.push(HomePage);
            //this.appCtrl.getRootNav().push(IndexPage);
            //location.reload()
            this.navCtrl.setRoot(HomePage).then(() =>{
              this.navCtrl.popToRoot();
            });

          }
          if(data[0] == 500){
            this.generateAlert("Error",'No tienes permisos adecuados para acceder. Ponte en contacto con el administrador de tu Deck.');
          }
        },
        (err) => {
          if(err.status == 400){
            this.generateAlert("Error",'No hemos podido verificar tus datos. Intentalo de nuevo');
          }
        }
      );
    },
    (err) => {
      if(err.status == 400){
        this.generateAlert("Error",'Usuario o constraseña no válido. Intentalo de nuevo');
      }
    }
  );
}

Login html

<ion-content padding id="container-home" style="background-image:url('assets/img/bg-login.png')">

  <ion-row>
    <ion-img class="logo-md" width="120" height="120" src="assets/img/mydecklogocolor.png"></ion-img>
  </ion-row>

  <ion-row id="auth-login">
    <ion-col col-12 no-padding>
      <ion-row class="header">
        <h3>Ingresa</h3>
      </ion-row>
      <form id="login-container" [formGroup]="login" (ngSubmit)="loginForm()">
      <ion-row>
          <ion-item>
            <ion-input type="text" formControlName="username"
                       class="input-md"placeholder="Correo electrónico / usuario"></ion-input>
          </ion-item>
          <ion-item>
            <ion-input type="password" formControlName="password"
                       class="input-md" placeholder="Contraseña"></ion-input>
          </ion-item>
      </ion-row>
      <ion-row>
        <button ion-button class="auth-btn" type="submit" [disabled]="!login.valid">Ingresar</button>
      </ion-row>
      </form>
      <ion-row>
        <a href="">¿Olvidaste tu contraseña?</a>
      </ion-row>
    </ion-col>
  </ion-row>

</ion-content>

Upvotes: 2

Views: 743

Answers (1)

Suraj Rao
Suraj Rao

Reputation: 29614

In case of Ionic Storage, it returns a promise for both set and get functions. So they are asynchronous.

So you could try:

 this.storage.set('access_token', token).then(()=>{

      this.navCtrl.setRoot(HomePage);
});

You dont need to "refresh the page". You can simply set Home Page as root as soon as you are done with saving the token.

Upvotes: 1

Related Questions