web-dev-qa-db-fra.com

L'appel à Http.post ne déclenche pas de publication dans angular 6

J'ai généré les composants et services de mes entités selon mon modèle en utilisant cet outil .

Tout a bien fonctionné, mais j'ai rencontré un problème lors de la tentative de connexion d'un utilisateur dans mon API (qui est fonctionnel).

La méthode http.post() n'est pas déclenchée. Je suis assez nouveau pour angular et je ne peux pas comprendre ce que je fais mal.

Toute aide est la bienvenue!

Voici ma méthode de connexion de mon UserService (la méthode est appelée correctement, c'est seulement la http.post() qui ne fonctionne pas):

/**
 * Log a user by its credentials.
 */
login(username : string, password : string) : Observable<NmUser> {
    let body = JSON.stringify({
        'username': username,
        'password': password
    });
    console.log(body);
    return this.http.post(this.userUrl + 'login', body, httpOptions)
        .pipe(
            map(response => new NmUser(response)),
            catchError(this.handleError)
        );
} // sample method from angular doc
private handleError (error: HttpErrorResponse) {
    // TODO: seems we cannot use messageService from here...
    let errMsg = (error.message) ? error.message : 'Server error';
    console.error(errMsg);
    if (error.status === 401 ) {
        window.location.href = '/';
    }
    return Observable.throw(errMsg);
}

Voici la page qui appelle la fonction de connexion:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { NmUserService } from '../../app/entities/nmUser/nmUser.service';

@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
  providers: [NmUserService]
})
export class LoginPage {

  constructor(private navCtrl: NavController, private userService: NmUserService) {

  }

  login(username: string, password: string): void {
    this.userService.login(username, password);
  }

}

Merci !

6

L'appel HTTP ne sera jamais effectué à moins que vous ne vous abonniez à l'observable, ce qui se fait dans le composant comme ceci:

this.userService.login(username, password).subscribe((result) => {
    // This code will be executed when the HTTP call returns successfully 
});
21
user184994