jQuery टाइमगो या पल्पज और एंगुलरजेएस का उपयोग

Question

मैं timeago plugin का उपयोग करना चाहता हूं ताकि तिथियां अच्छी लगती हैं। समस्या यह है कि इन तिथियों को एंजुलरजेएस के माध्यम से आरईएसटी गतिशील रूप से लाया जाता है। इसलिए, जब मैं अपने jQuery पर यह jQuery प्लगइन संलग्न करता हूं, तो यह बस संसाधित नहीं करता है।

तो, ऐसी चीजों को बेहतर तरीके से कैसे करें? यदि संभव हो तो मुझे बिना jQuery के चलाने के लिए खुशी होगी।

Answer 1

मैं पलज का उपयोग करता हूं - http://momentjs.com/ - इसमें कोई निर्भरता नहीं है।

फिर आप केवल 'टाइमएगो' या 'अब से' नामक एक फ़िल्टर बना सकते हैं। आप शायद यह fromNow बुलाना चाहिए क्योंकि उस momentjs यह क्या कहता है है:

angular.module('myApp').filter('fromNow', function() { 
    return function(date) { 
    return moment(date).fromNow(); 
    } 
}); 

तो फिर तुम सिर्फ अपने दृश्य में बाध्यकारी सरल डेटा का प्रयोग करेंगे:

<p>Pizza arrives {{pizzaArrivalDate | fromNow}}</p> 

तुम सच में jQuery प्लगइन का उपयोग करना चाहता था, तो आप शायद एक निर्देश लिखना होगा। लेकिन ऐसा करने का यह तरीका खराब है क्योंकि यह आपके डेटा को डीओएम तत्व से जोड़ता है। जिस तरह से मैंने ऊपर रखा है डीओएम से डेटा अलग करता है जो कोणीय तरीका है। और यह सुंदर है :- डी

Answer 2

यदि आपको jQuery की आवश्यकता है, तो निर्देश/फ़िल्टर लिखना रास्ता है।

app.directive("timeAgo", function($compile) { 
    return { 
    restrict: "C", 
    link: function(scope, element, attrs) { 
     jQuery(element).timeago(); 
    } 
    }; 
}); 

app.filter("timeAgo", function() { 
    return function(date) { 
    return jQuery.timeago(date); 
    }; 
}); 

Directive and/or Filter (jsbin)

Answer 3

आप angular-moment मॉड्यूल (जो momentjs पर आधारित है) से am-time-ago निर्देश उपयोग कर सकते हैं।

इसे jQuery की आवश्यकता नहीं है, और समय प्रगति के समय अपडेट हो जाता है। उदाहरण:

<span am-time-ago="lastLoginTime"></span> 

ऊपर अवधि की सामग्री, एक रिश्तेदार समय स्ट्रिंग के साथ प्रतिस्थापित किया जाएगा उदाहरण के लिए "2 घंटे पहले", और समय के रूप में प्रगति स्वचालित रूप से अद्यतन किया जाएगा।

Answer 4

moment.js सबसे अच्छा विकल्प है। मैंने एक सामान्य पल फ़िल्टर बनाया है जो आपको किसी भी पल स्वरूपण विधि का उपयोग करने की अनुमति देता है।

angular.module('myApp', []) 
    .filter('moment', [ 
    function() { 
     return function (date, method) { 
     var momented = moment(date); 
     return momented[method].apply(momented, Array.prototype.slice.call(arguments, 2)); 
     }; 
    } 
    ]); 

तरह

<div>{{ date | moment:'fromNow' }}</div> 
<div>{{ date | moment:'calendar' }}</div> 

इसका इस्तेमाल आप कार्रवाई यहाँ http://jsfiddle.net/gregwym/7207osvw/