How can I reload page using Ionic 2

Question

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>

you mean this.storage.set('access_token', token); doesnt set in time? which storage is this? — Suraj Rao
– Suraj Rao, Commented Sep 5, 2017 at 6:16

Suraj Rao · Accepted Answer · 2017-09-05 13:54:25Z

1

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.

answered Sep 5, 2017 at 13:54

Suraj Rao

29.7k11 gold badges96 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can I reload page using Ionic 2

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related