I’m new to ionic and I just create Login and Register and also I have tabs in the apps , the thing is when I do " ionic serve " and my browser "Mozilla Firefox " show me the “Login Page” but when I click to "Inscription " (register) it just still showing the Alert , but the registration is done (like issam@gmail.com (Firebase)) and my browser stop working untill I ended the process Firefox in Windows Task Manager
(PS: I’m sorry for my English but I hope you get the idea )
Can you show the code that gets executed when clicking on the “Inscription” button?
import { Component, OnInit, ViewChild } from ‘@angular/core’;
import { IonSlides, LoadingController, ToastController } from ‘@ionic/angular’;
import { User } from ‘src/app/interfaces/user’;
import { AuthService } from ‘src/app/services/auth.service’;
import { Keyboard } from ‘@ionic-native/keyboard/ngx’;
import { AlertController } from ‘@ionic/angular’
import { Router } from ‘@angular/router’
@Component({
selector: ‘app-login’,
templateUrl: ‘./login.page.html’,
styleUrls: [’./login.page.scss’],
})
export class LoginPage implements OnInit {
@ViewChild(IonSlides) slides: IonSlides;
public wavesPosition: number = 0;
private wavesDifference: number = 100;
public userLogin: User = {};
public userRegister: User = {};
private loading: any;
constructor(
private authService: AuthService,
private loadingCtrl: LoadingController,
private toastCtrl: ToastController,
public alertController: AlertController,
public router: Router,
public keyboard: Keyboard
) { }
ngOnInit() { }
segmentChanged(event: any) {
if (event.detail.value === 'login') {
this.slides.slidePrev();
this.wavesPosition += this.wavesDifference;
} else {
this.slides.slideNext();
this.wavesPosition -= this.wavesDifference;
}
}
async presentAlert(title: string, content: string) {
const alert = await this.alertController.create({
header: title,
message: content,
buttons: ['OK']
})
await alert.present()
}
async login() {
await this.presentLoading();
try {
if (await this.authService.login(this.userLogin)){
this.router.navigateByUrl("/app/tabs/traveaux");
}
} catch (error) {
this.presentToast(error.message);
} finally {
this.loading.dismiss();
}
}
async register() {
await this.presentLoading();
try {
if(await this.authService.register(this.userRegister)){
this.presentAlert('Success', 'You are registered!')
this.router.navigateByUrl("/app/tabs/traveaux");
}
} catch (error) {
this.presentToast(error.message);
} finally {
this.loading.dismiss();
}
}
async presentLoading() {
this.loading = await this.loadingCtrl.create({ message: 'Att SVP...' });
return this.loading.present();
}
async presentToast(message: string) {
const toast = await this.toastCtrl.create({ message, duration: 2000 });
toast.present();
}
}
Le ven. 17 mai 2019 à 17:39, Matt E via Ionic Forum ionicframework@discoursemail.com a écrit :
Login.page.html
<ion-segment (ionChange)="segmentChanged($event)" mode="ios" value="login">
<ion-segment-button mode="ios" value="login">
<ion-label>Login</ion-label>
</ion-segment-button>
<ion-segment-button mode="ios" value="register">
<ion-label>Inscription</ion-label>
</ion-segment-button>
</ion-segment>
<ion-slide>
<div class="slide-inner ion-padding">
<span>Login</span>
<ion-item class="ion-margin-top" lines="none">
<ion-input type="email" placeholder="E-mail" [(ngModel)]="userLogin.email"></ion-input>
</ion-item>
<ion-item class="ion-margin-top" lines="none">
<ion-input type="password" placeholder="Mot de passe" [(ngModel)]="userLogin.password"></ion-input>
</ion-item>
<ion-button class="ion-margin-top" (click)="login()" color="light" expand="block">
Entrer
</ion-button>
</div>
</ion-slide>
<ion-slide>
<div class="slide-inner ion-padding">
<span>Inscription</span>
<ion-item class="ion-margin-top" lines="none">
<ion-input type="text" placeholder="Nom"></ion-input>
</ion-item>
<ion-item class="ion-margin-top" lines="none">
<ion-input type="email" placeholder="E-mail" [(ngModel)]="userRegister.email"></ion-input>
</ion-item>
<ion-item class="ion-margin-top" lines="none">
<ion-input type="password" placeholder="Mot de passe" [(ngModel)]="userRegister.password"></ion-input>
</ion-item>
<ion-button class="ion-margin-top" (click)="register()" color="light" expand="block">
Inscription
</ion-button>
</div>
</ion-slide>
<div class="container bottom ion-text-center" [hidden]="keyboard.isVisible">
<span>Application Mobile Pour Maintenance Des Ascenseurs</span>
</div>
Can you give me the code of the authService?
It looks like it never returns a value and might be an infinite loop in the service.
import { Injectable } from ‘@angular/core’;
import { AngularFireAuth } from ‘@angular/fire/auth’;
import { User } from ‘…/interfaces/user’;
@Injectable({
providedIn: ‘root’
})
export class AuthService {
constructor(private afa: AngularFireAuth) { }
login(user: User) {
return this.afa.auth.signInWithEmailAndPassword(user.email, user.password);
}
register(user: User) {
return this.afa.auth.createUserWithEmailAndPassword(user.email, user.password);
}
logout() {
return this.afa.auth.signOut();
}
getAuth() {
return this.afa.auth;
}
}
Le ven. 17 mai 2019 à 20:46, Matt E via Ionic Forum ionicframework@discoursemail.com a écrit :