Angular Observables Modifier la variable de fonction locale à partir de l'abonnement onSuccess => {}

Question

J'essaie donc de changer la variable 'succès' dans le rappel de la fonction de succès après m'être abonné à l'observable. J'ai débogué avec le débogueur Chrome après avoir écrit un test pour celui-ci et ne pas retourner vrai sur un POST réussi.

Le test passe dans la fonction réponse => {} mais après avoir passé par "réussite = vrai", il est toujours faux. Puisque je vais le faire pour diverses autres fonctions, je préférerais avoir une longue liste de variables de classe afin de pouvoir y faire référence avec "ceci" comme je l'ai vu dans divers autres exemples. Y a-t-il un moyen de rendre le succès vrai?

public login(username: string, password: string): boolean { 
    let success = false; 

    this.http.post<LoginResponse>('/api/login_check', {username: username, password: password}).subscribe(
    response => { 
     success   = true; 
     this.currentUser = new User(response.user); 
     sessionStorage.setItem('userJWT', response.token); 
    }, 
    error => { 
     console.log('Login failed - ' + error); 
    } 
); 

    return success; 
} 

Answer 1

Vous ne pouvez pas mélanger une fonction synchrone et asynchrone pour obtenir le résultat.

Une fois que vous appelez quelque chose d'asynchrone, vous devez l'attendre, car cela se produira en dehors du thread.

Cela fonctionne par exemple

UserService

import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http'; 

import { Observable } from 'rxjs/Observable'; 

@Injectable() 
export class UserService { 
    constructor(private http: Http) { } 

    login(username: string, password: string): Observable { 
     return this.http.post('/api/authenticate', JSON.stringify({ username: username, password: password })) 
      .map((response: Response) => { 
       if (response.status === 200) { 
        return response.json(); 
       } 
       else { 
        throw new Error('Bad login!'); 
       } 
      }); 
    } 
} 

Et ailleurs dans votre composant

@Component({ 
    templateUrl: 'login.component.html' 
}) 
export class LoginComponent { 
    login() { 
     this.userService.login(this.model.username, this.model.password) 
      .subscribe(
       data => { 
        this.router.navigate([this.returnUrl]); 
       }, 
       error => { 
        this.alertService.error(error); 
       }); 
    } 
}