Ractive.jsを使用した日付変換

Question

JSONエンドポイントから返されたこのエポック時間値を "Tue 19 Jan 11:14:07 SGT 2038"のような時間文字列に変換するにはどうすればよいですか？

var ractive = new Ractive({ 
 
    el: '#container', 
 

 
    template: '#template', 
 

 
    data: { 
 
    lastUpdated: 2147483647 
 
    } 
 
});

<script src="http://cdn.ractivejs.org/latest/ractive.js"></script> 
 
<pre>$ date --date='@2147483647' \t 
 
Tue 19 Jan 11:14:07 SGT 2038 
 
</pre> 
 

 
<div id='container'></div> 
 
<script id='template' type='text/ractive'> 
 
    <h1>Time: {{Date(lastUpdated)}}</h1> 
 
</script>

私はmoment.jsのような追加のライブラリを使用する必要はありません。ありがとう！

Answer 1

RACTIVEは日付をフォーマットする方法についての意見を持っていませんが、あなたは非常に簡単にdataオブジェクトにカスタムフォーマッタを追加することができます：

var ractive = new Ractive({ 
    el: '#container', 
    template: '<h1>Time: {{formatDate(lastUpdated)}}</h1>', 
    data: { 
    lastUpdated: 2147483647, 
    formatDate: function (date) { 
     // formatting code goes here... 
    } 
    } 
}); 

lastUpdatedが変更されるたびに、 terが再び呼び出されます。

Answer 2

あなたはこのためにMomentJSを使用することができます。

var ts = 2147483647; 
 
var m = moment(ts); 
 
var s = m.format("LLLL"); 
 
var ractive = new Ractive({ 
 
    el: '#container', 
 

 
    template: '#template', 
 

 
    data: { 
 
    lastUpdated: s 
 
    } 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.12.0/locale/af.js"></script> 
 
<script src="http://cdn.ractivejs.org/latest/ractive.js"></script> 
 
<pre>$ date --date='@2147483647' \t 
 
Tue 19 Jan 11:14:07 SGT 2038 
 
</pre> 
 

 
<div id='container'></div> 
 
<script id='template' type='text/ractive'> 
 
    <h1>Time: {{lastUpdated}}</h1> 
 
</script>