-1
votes

Angular7 reçoivent des données API avant d'exécuter la fonction suivante

J'aimerais recevoir des données de API avant d'exécuter la fonction suivante dans Angular7

'Data.Service.ts P>

  public users
  constructor(private dataservice: DataService) {}

  ngOnInit() {
    this.users = this.dataservice.getData()
    console.log(this.users)
    next_function()
    ....

angular asynchronous httpclient angular-promise

1 commentaires

Faire une fonction async signifie simplement qu'il retourne toujours une promesse et vous pouvez utiliser attendre à l'intérieur. Cela ne rend pas comme par magie ses appelants reçoivent la valeur de manière synchrone, ils doivent encore résoudre la promesse.

3 Réponses :

1
votes

Ce que vous pouvez faire ici est de renvoyer l'observable de l'appel http et de vous abonner à cela.

data.service.ts strong> p>

this.dataservice.getData().subscribe(resp => {
   this.users = resp; // here you set the users
   next_function(); // this function will be called after getting data from the service
});

0 commentaires

0
votes

Si vous voulez coller à la recette Promise / Async / Await, vous pouvez le faire de cette façon:

// service
getData() {
    return this.http.get(this.url).toPromise();
}

// component
async ngOnInit() {
    this.users = await this.dataservice.getData();
    console.log(this.users);
    next_function();

0 commentaires

0
votes

Vous n'avez pas besoin d'utiliser async code> / attendre code> ici du tout. Vous utilisez déjà topromise code> dans getdata code> pour convertir l'observable en une promesse. Vous pouvez simplement renvoyer cette promesse et gérer le reste dans le composant.

ngOnInit() {
    this.dataservice.getData().then(users => {
        console.log(users);
        next_function();
    }, err => {
        console.log(err);
    });
}

0 commentaires