Discussion :

[tmrdry]

Bonjour,

Je suis actuellement en train de développer une application à l'aide de Ionic et Angular.
J'ai un petit soucis dans mon application:

Ma première page est une page de connexion avec un formulaire (email/mot de passe) et un bouton login. L'utilisateur peut se connecter si son email et mdp est validée.
Mon problème est que je dois appuyer 2 fois sur le bouton connexion pour que l'utilisateur puisse se connecter ou non (affiche un message d'erreur) ..

Pareil pour une seconde page qui est censé afficher les données de l'utilisateur grace à une requete http dans mon service (tout comme la connexion), les données ne s'affichent que si je rafrachis la page..

j'espère que vous pourrez m'aider

merci beaucoup!

Voici un apercu de mon code dans mon .ts et mon service:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
ngOnInit(){
    this.login_form = this.formBuilder.group({
      email: new FormControl('', Validators.compose([
        Validators.required,
        Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$')
      ])),
      password: new FormControl('', Validators.required)
    });
  }
 
  login() {
    if(this.loginService.searchData(this.login_form.value.email, this.login_form.value.password).success==1){
      this.router.navigate(['/events']);
    }
    else {
      this.error=true;
    }
  }

pour le service:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
searchData(email: string, password: string){
    const httpOptions = {
      params: {key: 'MepC9NTcz759',email: email, password: password}
    }
    this.http.get(this.apiKey, httpOptions).subscribe((response: Response)=>{this.config=response});
    return(this.config);
  }

[Invité]

Bonjour et bienvenue sur DVP,

MERCI de copier-coller les codes (nécessaires et suffisants) directement dans le contenu du message, entre balises [CODE][/CODE] (icône # du menu).

[tmrdry]

C'est fait!

[krakatoa]

et le html ?

[tmrdry]

le voici:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<ion-header>
  <ion-toolbar>
    <ion-title class="text-center">
      Gestion billeterie des évènements
    </ion-title>
  </ion-toolbar>
</ion-header>
 
 
<ion-content fullscreen>
  <form [formGroup]="login_form" (ngSubmit)="login()">
    <ion-input required id="email" type="email" formControlName="email" placeholder="Votre adresse email" class="form-control"></ion-input>
 
    <ion-input required id="password" type="password" formControlName="password" placeholder="Mot de passe" class="form-control"></ion-input>
 
    <div class="ion-padding">
      <ion-button expand="block" type="submit" class="ion-no-margin" [disabled]="!login_form.valid">Connexion</ion-button>
    </div>
  </form>
  <div *ngIf="this.error">
    Email ou mot de passe incorrect
  </div>
</ion-content>

[krakatoa]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
searchData(email: string, password: string){
    const httpOptions = {
      params: {key: 'MepC9NTcz759',email: email, password: password}
    }
    this.http.get(this.apiKey, httpOptions).subscribe((response: Response)=>{this.config=response});
    return(this.config);
  }

en rouge, un problème. tu le vois ?