Instafeedjs moment.js返回時間

Question

使用instafeedjs和moment.js呈現instagram饋送並將日期格式化爲相對格式（X天/月/小時/分鐘前）。

正如您在下面看到的，成功函數回調循環通過數組將圖像分隔成獨特的DOM容器。這部分工作完美，但是，現在我需要獲取'caption.created_date'，它也包含一些小技巧。我可以非常容易地輸出unix時間戳，但似乎無法將其轉換爲上述所需的輸出。

非常感謝你的幫助。

var imgs = []; 
 
var feed = new Instafeed({ 
 
    limit: '12', 
 
    get: 'user', 
 
    userId: XXXXX, 
 
    clientId: 'XXXXXXXXXXXXXXXXXXXX', 
 
    accessToken: 'XXXXX.XXXXX.XXXXX', 
 
    limit: 20, 
 
    resolution: 'standard_resolution', 
 
    template: '{{model.created_time_ago}}<img src="{{image}}"/>', 
 
    filter: function (image) { 
 
     var imageDate = new Date(parseInt(image.created_time * 1000, 10)); 
 
     var timeAgo = moment(imageDate).fromNow(); 
 
     image.create_time_ago = timeAgo; 
 
     return true; 
 
    }, 
 
    success: function (data) { 
 
     // read the feed data and create owr own data struture. 
 
     var images = data.data; 
 
     var result; 
 
     for (i = 0; i < images.length; i++) { 
 
      var image = images[i]; 
 
      result = this._makeTemplate(this.options.template, { 
 
       model:  image, 
 
       id:   image.id, 
 
       link:  image.link, 
 
       caption:  image.caption.text, 
 
       created_time:image.caption.created_time, 
 
       image: image.images[this.options.resolution].url 
 
      }); 
 
      imgs.push(result); 
 
     } 
 
     //split the feed into divs 
 
     $("#gram1").html(imgs.slice(0, 1)); 
 
     $("#gram2").html(imgs.slice(1, 2)); 
 
     $("#gram3").html(imgs.slice(2, 3)); 
 
    
 
    } 
 
}); 
 
feed.run();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<script src="http://instafeedjs.com/js/instafeed.min.js"></script> 
 

 
<div id="gram1"></div> 
 
    
 
<div id="gram2"></div> 
 
    
 
<div id="gram3"></div>

Answer 1

伊夫插入HTML到DOM後立即解決了這個利用成功回調中moment.js。矩是從插入模板段落的數據屬性中獲取hte unix時間戳。

工程就像一個魅力！

var imgs = []; 
var feed = new Instafeed({ 
    limit: '12', 
    get: 'user', 
    userId: 1934632453, 
    clientId: 'b4986d7624834f60a58c773bd4ccc5f3', 
    accessToken: '1934632453.467ede5.c8d670901ebe4229b293c9ff705810d3', 
    limit: 20, 
    resolution: 'standard_resolution', 
    template: '<p data-unix="{{created_time}}" class="unix-time"></p><img src="{{image}}"/>', 
    success: function (data) { 
     // read the feed data and create our own data struture. 
     var images = data.data; 
     var result; 
     for (i = 0; i < images.length; i++) { 
      var image = images[i]; 
      result = this._makeTemplate(this.options.template, { 
       model:  image, 
       id:   image.id, 
       link:  image.link, 
       caption:  image.caption.text, 
       created_time:image.created_time, 
       image: image.images[this.options.resolution].url 
      }); 
      imgs.push(result); 
     } 
     //split the feed into divs 
     $("#gram1").html(imgs.slice(0, 1)); 
     $("#gram2").html(imgs.slice(1, 2)); 
     $("#gram3").html(imgs.slice(2, 3)); 

     //convert time to relative time ago. 
     $(".unix-time").each(function(){ 
      var time = moment.unix($(this).attr('data-unix')).fromNow(); 
      $(this).append(time); 
     }); 
    } 
}); 
feed.run();