ractive.js으로 정렬하는 방법

Question

내가 가진 한 다음 데이터 (샘플) :

"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 

내가 원하는 것은 먼저 eventDate를 정렬하여 들어오는 eventDate를 가져 오므로 l이됩니다. 예 :

21/10/2016 EVENT INFO 4 

22/10/2016 EVENT INFO 2 

23/10/2016 EVENT INFO 1 

가장 적합한 방법은 무엇입니까?

Answer 1

ractive 인스턴스에서 일부 수명주기 이벤트 (또는 관찰 된 변경/사용자 정의 이벤트?)에서 데이터를 정렬해야합니다. 날짜 문자열로 날짜가 있기 때문에 비교하기 전에 날짜 객체로 파싱해야합니다.

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/