Я пытаюсь отсортировать массив, полученный с помощью Observable .
Я должен сделать http-вызов (this.myService.getReview(id))
, используя свойство res (идентификатор) и добавить это свойство к res['like_count']
. Наконец, я должен вставить res в массив this.finalist
, чтобы использовать его в HTML-коде.
Мне нужно отсортировать его по значению like_count
, чтобы отобразить элементы в правильном порядке. Как вы можете видеть ниже, я пытался реализовать метод сортировки, но я не уверен, что он находится в правильном положении.
В результате первая часть предметов находится в правильном порядке, но в определенный момент порядок снова становится случайным , а если я попытаюсь console.log(this.finalist)
, порядок будет правильным.
Что я мог попытаться решить? Это связано с асинхронными функциями?
Спасибо
component.ts
finalist = [];
.subscribe((res => {
for (let i=0; i < res.length; i++) {
for (let m=1; m < Object.keys(res[i]).length - 1; m++) {
this.myService.getReview(res[i][m]['id'])
.then((res2 => {
res[i][m]['like_count'] = parseInt(res2['like_count'])
if (!(this.finalist.some(e => e.title == this.reviewslist[i][m]['title']))) {
this.finalist.push(res[i][m])
this.finalist.sort(function(a,b) {return (a['like_count'] > b['like_count']) ? 1 : ((b['like_count'] > a['like_count']) ? -1 : 0);} );
}
}));
}
}
console.log(this.finalist)
// shows items in the right order
}));
component.html:
<ion-content>
<ion-grid>
<ion-row *ngFor="let item of finalist | keyvalue">
<ion-col>
<img [src]="item?.value.image">
</ion-col>
<ion-col size="3">
<p>{{item?.value.title | titlecase}}</p>
</ion-col>
<ion-col size="9">
<p>| N. of votes: {{item?.value.like_count}}</p>
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
экранов (слева направо):