Tengo que ordenar la matriz de objetos en función de la respuesta de la matriz de la primera llamada a la API. Los datos deben ordenarse en orden ascendente.
Actualmente tengo la primera llamada a la API que devuelve la lista de matrices que se usarán en la próxima llamada a la API.
this.service.fetchStories() .pipe( take(1), ).subscribe((res: any) => { this.storyIds = res; });La primera llamada devuelve algo como esto.
[0001,0002,0003,0004,0005]Y estoy recorriendo los storyIds y lo pasé en el componente de la tarjeta
<div *ngFor="let id of storyIds | slice: start:end"> <app-cards [id]="id"></app-cards> </div>Y estoy obteniendo la segunda API en función de los identificadores en el componente de mi tarjeta
this.service.fetchStoryItems(this.id) .pipe( take(1) ) .subscribe((res: StoryItem) => { if (res !== undefined) { this.data = res; } })La segunda API devuelve cada respuesta después del ciclo.
{name: 'John', score: 1} {name: 'Jane', score: 99} {name: 'Joe', score: 53}Estoy atascado aquí y quiero ordenar los elementos según el puntaje que devuelve la segunda llamada a la API.
Estoy pensando en algo como empujar cada objeto a una matriz y ordenar la nueva matriz de objetos
La mejor solución sería hacer que las tarjetas de aplicación sean tontas y proporcionar la historia ya obtenida a la tarjeta de aplicación.
Componente
this.service.fetchStories().pipe( switchMap(idArray => forkJoin(idArray.map(id => this.service.fetchStoryItems(this.id)))), map(storyArray => storyArray.sort((a,b) => a.score - b.score)), take(1), ).subscribe(res => { this.stories = res; });HTML
<div *ngFor="let story of stories | slice: start:end"> <app-cards [story]="story"></app-cards> </div>Eliminar las llamadas HTTP de las tarjetas de aplicación
Puede modificar los datos de retorno de su segunda llamada api
this.service.fetchStoryItems(this.id) .pipe( take(1), map(response => { return {...response, id: this.id }) ) .subscribe((res: StoryItem) => { if (res !== undefined) { this.data = res; console.log(this.data) // should include the id and can be sorted with comparer function } })¿Qué this.data = res.sort( (a,b) => a.score - b.score );