angulaire 2 comment retourner les données de s'abonner

Question

C'est ce que je veux faire.

Si a été appelé à l'intérieur de la , Vous pouvez suggérer de l'attribuer à une variable comme et l'utiliser j'aime . Mais j'avais besoin d'utiliser comme `` pour mon propre but. S'll vous plaît, suggérez-moi ?

Answer 1

Vous juste ne pouvez pas retourner directement la valeur parce que c'est un appel asynchrone. Un appel asynchrone signifie qu'il est en cours d'exécution en arrière-plan (en fait, planifiée pour la fin de l'exécution), tandis que votre code continue de s'exécuter.

Vous aussi vous ne pouvez pas avoir un tel code dans la classe. Il doit être déplacé dans une méthode ou le constructeur.

Ce que vous pouvez faire est de ne pas subscribe() directement, mais utiliser un opérateur comme map()

export class DataComponent{
    someMethod() {
      return this.http.get(path).map(res => {
        return res.json();
      });
    }
}

En outre, vous pouvez combiner plusieurs .map avec les mêmes Observables que parfois cela améliore code de la clarté et de la garde des choses distinctes. Exemple:

validateResponse = (response) => validate(response);

parseJson = (json) => JSON.parse(json);

fetchUnits() {
    return this.http.get(requestUrl).map(this.validateResponse).map(this.parseJson);
}

De cette façon observable sera de retour à l'appelant pouvez vous abonner à

export class DataComponent{
    someMethod() {
      return this.http.get(path).map(res => {
        return res.json();
      });
    }

    otherMethod() {
      this.someMethod().subscribe(data => this.data = data);
    }
}

L'appelant peut également l'être dans une autre classe. Ici c'est juste pour des raisons de concision.

data => this.data = data

et

res => return res.json()

sont fléchées fonctions. Ils sont semblables à des fonctions normales. Ces fonctions sont passés subscribe(...) ou map(...) à être appelée à partir de l'observable lorsque les données arrivent de la réponse. C'est pourquoi les données ne peuvent pas être retournés directement, parce que quand someMethod() est terminé, les données n'a pas encore reçu.

Answer 2

Deux façons que je connais:

export class SomeComponent implements OnInit
{
    public localVar:any;

    ngOnInit(){
        this.http.get(Path).map(res => res.json()).subscribe(res => this.localVar = res);
    }
}

Cela va affecter votre résultat dans la variable locale une fois que l'information est retournée comme une promesse. Alors que vous venez de faire, {{ localVar }}

Une autre Façon est d'obtenir un observables comme un localVariable.

export class SomeComponent
{
    public localVar:any;

    constructor()
    {
        this.localVar = this.http.get(path).map(res => res.json());
    }
}

De cette façon, vous êtes exposant une observable à quel point vous pouvez faire dans votre code html est d'utiliser AsyncPipe {{ localVar | async }}

S'il vous plaît essayer it out et laissez-moi savoir si ça fonctionne. Aussi, depuis angulaire 2 est assez nouveau, n'hésitez pas à commenter si quelque chose est faux.

J'espère que ça aide

Answer 3

J'ai utilisé de cette façon beaucoup de temps ...

<div class="snippet" data-babel="false" data-console="true" data-hide="false" data-lang="js"> <div class="snippet-code">

</div></div>utiliser un mot clé statique et gagner du temps... ici, soit vous pouvez utiliser variable statique ou directement retourner objet que vous voulez .... j'espère qu'il vous aidera. codage heureux ...