mustache.js दिनांक स्वरूपण

Question

मैंने mustache.js का उपयोग करना शुरू कर दिया है और अब तक मैं बहुत प्रभावित हूं। हालांकि दो चीजें मुझे पहेली। पहली बार दूसरे के साथ भालू मेरे साथ भालू।

मेरे JSON

{"goalsCollection": [ 
    { 
     "Id": "d5dce10e-513c-449d-8e34-8fe771fa464a", 
     "Description": "Multum", 
     "TargetAmount": 2935.9, 
     "TargetDate": "/Date(1558998000000)/" 
    }, 
    { 
     "Id": "eac65501-21f5-f831-fb07-dcfead50d1d9", 
     "Description": "quad nomen", 
     "TargetAmount": 6976.12, 
     "TargetDate": "/Date(1606953600000)/" 
    } 
]}; 

मेरे हैंडलिंग समारोह

function renderInvestmentGoals(collection) { 
    var tpl = '{{#goalsCollection}}<tr><td>{{Description}}</td><td>{{TargetAmount}}</td><td>{{TargetDate}}</td></tr>{{/goalsCollection}}'; 
    $('#tblGoals tbody').html('').html(Mustache.to_html(tpl, collection)); 
} 

Q1 तुम मेरे 'TargetDate की जरूरतों को पार्स देख सकते हैं, लेकिन मैं कैसे करना है कि को लेकर अनिश्चित हूं रूप में मेरे वर्तमान समारोह के भीतर।

Q2 मैं कुछ समारोह या प्रतिपादन से पहले एक या मेरी वस्तुओं की अधिक पर स्वरूपण, यह क्या करने का सबसे अच्छा तरीका है प्रदर्शन करने के लिए चाहता था कहो?

Answer 1

मैं क्लाइंट/सर्वर पर साझा करने की अपनी क्षमता के कारण, मेरी परियोजनाओं के लिए भी मूशा का उपयोग कर रहा हूं। मैं जो कर रहा हूं वह सभी मूल्यों (तिथियों, मुद्रा) को स्ट्रिंग सर्वर-साइड में स्वरूपित कर रहा था, इसलिए मुझे सहायक जावास्क्रिप्ट कार्यों पर भरोसा नहीं करना है। यद्यपि आप इन मूल्यों के क्लाइंट-साइड के खिलाफ तर्क कर रहे हैं, हालांकि यह आपके लिए अच्छा काम नहीं कर सकता है।

आप handlebars.js का उपयोग करना भी चाह सकते हैं, जो अनिवार्य रूप से मूंछ है, लेकिन एक्सटेंशन के साथ जो क्लाइंट-साइड स्वरूपण (और अधिक) के साथ मदद कर सकता है। यहां नुकसान यह है कि यदि आप महत्वपूर्ण हैं तो आप शायद हैंडलबार्स के सर्वर-साइड कार्यान्वयन को नहीं ढूंढ पाएंगे।

Answer 2

आप सरल स्ट्रिंग तरीकों का उपयोग कर टाइमस्टैम्प प्राप्त कर सकते हैं:

goalsCollection.targetDate = goalsCollection.targetDate.substring(6,18); 

बेशक

, यह आपके टाइमस्टैम्प हर बार एक ही लंबाई किया जा रहा है पर निर्भर करता है। एक अन्य विकल्प है:

goalsCollection.targetDate = 
    goalsCollection.targetDate.substring(6, goalsCollection.targetDate.length - 1); 

इन तकनीकों में मूंछें लिए विशिष्ट नहीं हैं और किसी भी लाइब्रेरी के लिए डेटा हेरफेर करने के लिए इस्तेमाल किया जा सकता। अधिक जानकारी के लिए Mozilla Developer Center Documentation on substring देखें। लिंक से

<td> 
{{#FormatDate}} 
    {{TargetDate}} 
{{/FormatDate}} 
</td> 

:

Answer 3

आपको मार्क-अप में फिर एक "lambda"

"TargetDate": "/Date(1606953600000)/", 
"FormatDate": function() { 
    return function(rawDate) { 
     return rawDate.toString(); 
    } 
}, ... 

उपयोग कर सकते हैं

जब मूल्य इस तरह के एक समारोह के रूप में, एक प्रतिदेय वस्तु है या लैम्ब्डा, वस्तु को बुलाया जाएगा और पाठ के ब्लॉक को पारित किया जाएगा। पारित पाठ शाब्दिक ब्लॉक है, असुरक्षित।

Answer 4

एक जेसन के भीतर एक फ़ंक्शन घोषित करने के लिए आप हमेशा ऐसा कर सकते हैं।

var json = '{"RESULTS": true, "count": 1, "targetdate" : "/Date(1606953600000)/"}' 

var obj = JSON.parse(json); 
obj.newFunc = function (x) { 
    return x; 
} 

//OUTPUT 
alert(obj.newFunc(123)); 

Answer 5

यह बहुत समय पहले है लेकिन इस पर बिल्कुल वही खोज रहा है। Mustachejs (अब) आपको पास किए गए डेटा के कार्यों को कॉल करने की अनुमति देता है और न केवल वह; फ़ंक्शन में this का मान किसी सेक्शन में जो भी मान सत्य है।

मेरे टेम्पलेट इस तरह है:

{{#names}} 
    <p>Name is:{{name}}</p> 
    <!-- Comment will be removed by compileTemplates.sh 
     #lastLogin is an if statement if lastLogin it'll do this 
     ^lastLogin will execute if there is not lastLogin  
    --> 
    {{#lastLogin}} 
    <!-- 
     formatLogin is a method to format last Login 
     the function has to be part of the data sent 
     to the template 
    --> 
    <p>Last Login:{{formatLogin}}</p> 
    {{/lastLogin}} 
    {{^lastLogin}} 
    not logged in yet 
    {{/lastLogin}} 
    {{#name}} 
    passing name to it now:{{formatLogin}} 
    {{/name}} 
{{/names}} 

और डाटा इस तरह:

var data={ 
    names:[ 
     {name:"Willy",lastLogin:new Date()} 
    ], 
    formatLogin:function(){ 
      //this is the lastDate used or name based on the block 
        //{{#name}}{{formatLogin}}{{/name}}:this is name 
        //{{#lastLogin}}{{formatLogin}}{{/lastLogin}}:this is lastLogin 
      if(!/Date\]$/.test(Object.prototype.toString.call(this))){ 
       return "Invalid Date:"+this; 
      } 
      return this.getFullYear() 
      +"-"+this.getMonth()+1 
      +"-"+this.getDate(); 
    } 
}; 
var output = Mustache.render(templates.test, data); 
console.log(output); 

Answer 6

मैं जो भाव के अंदर formatters के उपयोग के लिए सक्षम बनाता है Mustache.js के लिए एक छोटा सा विस्तार बनाया है, जैसे {{अभिव्यक्ति | फ़ॉर्मेटर}}

आप वैसे भी एक समारोह है कि इस तरह अपनी तिथि मूल्य पार्स करता है बनाने के लिए की आवश्यकता होगी:

{{TargetDate | date}} 

आप हड़पने कर सकते हैं: बस अपने भाव को फ़ॉर्मेटर जोड़ने

     Mustache.Formatters = { 
     date: function(str) { 
      var dt = new Date(parseInt(str.substr(6, str.length-8), 10)); 
      return (dt.getDate() + "/" + (dt.getMonth() + 1) + "/" + dt.getFullYear()); 
     } 
     }; 

और फिर यहां से कोड: http://jvitela.github.io/mustache-wax/