2
votes

Angular 7 ajoutant des données au résultat de la requête http

J'obtiens un tableau d'identifiants (assetIDs) et j'utilise ces identifiants pour demander des données. Pour chaque requête http, je reçois un ou plusieurs ensembles de données. Je souhaite ajouter l'ID de demande à chaque ensemble de données, puis renvoyer les données.

Obtenir et renvoyer les données fonctionne très bien, mais je ne sais pas comment ajouter cet ID d'actif à l'ensemble de données.

Lorsque je le fais comme dans l'extrait de code suivant, je n'obtiens que le premier ensemble de données de chaque ID. (Bien sûr ... à cause du [0]). Mais comment puis-je parcourir tous les ensembles de données?

getData(assetIds: Array<string>): Observable<any> {
 const data = assetIds.map(assetId => {
  // for each assetId
  const path = this.serverUrl + '?' + 'assetid=' + assetId;
  return this.httpClient.get(path).pipe(
    map((res: any[]) => {
      const resultArray = [];
      res.forEach(element => {
        const row = {
          name: res[element].name,
          type: res[element].type,
          asset: assetId
        };
        resultArray.push(row);
      });
      return resultArray;
    }));
});
// return combined result of each assetId request
return forkJoin(data);

J'ai également essayé ce qui suit, mais je ne reçois aucune donnée en faisant cela:

getData(assetIds: Array<string>): Observable<any> {
  const data = assetIds.map(assetId => {
    // for each assetId
    const path = this.serverUrl + '?' + 'assetid=' + assetId;
    return this.httpClient.get(path).pipe(
      map((res: any[]) => {
        return {
          name: res[0].name,
          type: res[0].type,
          asset: assetId
        };
    }));
});

// return combined result of each assetId request
return forkJoin(data);
}

}

javascript typescript angular rxjs http

0 commentaires

3 Réponses :

0
votes

Vous pouvez également utiliser map sur votre tableau de résultats. Quelque chose comme ceci:

const data = assetIds.map(assetId => {
    // for each assetId
    const path = this.serverUrl + '?' + 'assetid=' + assetId;
    return this.httpClient.get(path).pipe(
      map((res: any[]) => res.map(item => {
        return {
          name: item.name,
          type: item.type,
          asset: assetId
        }
      })));
  });

  // return combined result of each assetId request
  return forkJoin(data);
}

0 commentaires

1
votes

Votre deuxième approche semble bien. Je pense que le problème est que vous utilisez l'opérateur rxjs forkJoin .

Comme le dit la documentation RXJS, cet opérateur émet une valeur lorsque

Lorsque toutes les observables sont terminées, émettez la dernière valeur émise de chacune.

Vous avez essentiellement 2 options, changez l'opérateur forkJoin en zip

Une fois toutes les observables émises, émettez des valeurs sous forme de tableau

Ou ajoutez l'opérateur take (1) après la map sur pipe . L'opérateur Take complétera l'observable après l'envoi d'une valeur, permettant à forkJoin d'émettre ses valeurs

0 commentaires

0
votes

Merci pour vos réponses. J'ai tout essayé mais je suppose que le problème était que j'ai utilisé "élément" comme index dans le tableau. Le code suivant fonctionne désormais parfaitement:

return this.httpClient.get(path)
  .pipe(
    map((datasets: AssetFilesTableItem[]) => {
      const result: AssetFilesTableItem[] = [];
      let i = 0;
      datasets.forEach(element => {
        const dataset: AssetFilesTableItem = {
          name: datasets[i].name,
          type: datasets[i].type,
          size: datasets[i].size,
          timestamp: datasets[i].timestamp,
          created: datasets[i].created,
          updated: datasets[i].updated,
          asset: assetId
        };
        result.push(dataset);
        i++;
      });

      return result;
    }));

0 commentaires