#sorting #ractivejs
#сортировка #ractivejs
Вопрос:
У меня есть следующие данные (образец):
"data": {
"eventsHeading": "Upcoming events",
"eventsToBeDisplayed": 3,
"allEventLinkText": "See all events",
"eventsList": [
{
"eventDate": "23/10/2016",
"eventTitle": "EVENT INFO 1"
},
{
"eventDate": "22/10/2016",
"eventTitle": "EVENT INFO 2"
},
{
"eventDate": "24/10/2016",
"eventTitle": "EVENT INFO 3"
},
{
"eventDate": "21/10/2016",
"eventTitle": "EVENT INFO 4"
}
]
}
И у меня есть что-то вроде этого:
<table>
<tbody>
{{#eventsList:i}}
{{#i < eventsToBeDisplayed}}
<tr>
<td class="date-column">{{eventDate}}</td>
<td class="text-link truncate-text"><ux-anchor class="text-link" href="{{link}}">{{eventTitle}}</ux-anchor>
</tr>
{{/}}
{{/}}
</tbody>
</table>
Итак, в настоящее время это будет цикл для извлечения только 3 данных, и он покажет:
23/10/2016 EVENT INFO 1
22/10/2016 EVENT INFO 2
24/10/2016 EVENT INFO 3
Что я хочу сделать, так это сначала отсортировать дату события, поэтому я получу входящую дату события, так что это будет похоже на это:
21/10/2016 EVENT INFO 4
22/10/2016 EVENT INFO 2
23/10/2016 EVENT INFO 1
Каков наилучший подход для этого?
Ответ №1:
Вы должны отсортировать данные в каком-либо событии жизненного цикла (или, возможно, по наблюдаемым изменениям / пользовательским событиям?) в вашем активном экземпляре. Поскольку ваши даты представлены в виде строк date, вам необходимо проанализировать их в объект date, прежде чем вы сможете их сравнить.
this.set("eventsList",this.get("eventsList").sort( function (a, b) {
var aParts = a.eventDate.split("/");
var bParts = b.eventDate.split("/");
return new Date(aParts[2],aParts[1],aParts[0]) < new Date(bParts[2],bParts[1],bParts[0]) ? -1 : 1;
}));
Рабочая скрипка:http://jsfiddle.net/pq7yrncv
Комментарии:
1. Хорошо, я создал отдельный файл *.js для этого события. Итак, в файле *.json должны быть только данные. Большое спасибо за это @Leakim