Knockout.js प्रारूप दिनांक आइटम

Question

मेरे विचार में मैं knockout.js बाइंडेड फ़ील्ड प्रदर्शित करना चाहता हूं जिसमें एक तिथि है। यह सिर्फ एक प्रदर्शन क्षेत्र है, न कि इनपुट फ़ील्ड। नीचे जब basemodel.actionDate = ko.observable()

<p class="display-field" data-bind="text: baseModel.actionDate"/> 

हालांकि इस इस प्रकार प्रदर्शित किया जाता है की तरह कुछ:

2013-06-17T11:56:18.4537687Z 

क्या इस dd mm yyyy फ़ॉर्मेट करने के लिए सबसे आसान तरीका है। उदाहरण: 17 June 2013?

Answer 1

मैं moment.js दिनांक स्वरूपण लाइब्रेरी की अनुशंसा करता हूं।

यह उपयोग करके आप अपने ध्यान में रखते हुए कुछ इस तरह कर सकते हैं:

<p class="display-field" data-bind="text: moment(baseModel.actionDate()).format('LL')"/> 

Answer 2

या तो यह सुनिश्चित कर लें सेवा उत्पादन यह एक सही स्वरूप, या ग्राहक के पक्ष

में प्रारूप में आप इसे ग्राहक के पक्ष कार्यसूची तो आप एक दिनांक वस्तु में आईएसओ दिनांक स्ट्रिंग पार्स कर सकते हैं और उसके बाद का उपयोग jQuery के वैश्वीकृत चाहते हैं इसे वांछित प्रारूप में प्रारूपित करें।

मैं इस

http://jsfiddle.net/vRf5B/42/

ko.extenders.date = function(target, format) { 
    return ko.computed({ 
     read: function() { 
      var value = target(); 
      if(typeof value === "string") { 
       value = new Date(value);     
      } 

      format = typeof format === "string" ? format: undefined; 
      value = Globalize.format(value, format); 

      return value;   
     }, 
     write: target 
    }); 
} 

अद्यतन के लिए KO extenders का उपयोग

मैं अपने ब्लॉग कैसे कच्चे दिनांक मान यह मेरी उजागर किया जा सकता है पुनः प्राप्त करने पर एक प्रश्न मिला गणना की गई कच्ची मान

http://jsfiddle.net/vRf5B/91/

Answer 3

मैं मानचित्रण प्लगइन एक्सटेंडर उपयोग करने की कोशिश के साथ कुछ मुद्दों (मुझे लगता है कि) था। जब से मैं केवल दिनांक प्रदर्शित कर रहा हूँ और उन्हें अनुमति नहीं दे संपादित करने के लिए मैं सिर्फ इस तरह एक बाध्यकारी हैंडलर का उपयोग करना पसंद:

ko.bindingHandlers.date = 
    { 
     update: function (element, valueAccessor:() => any, allBindingsAccessor: any) 
     { 
      return ko.bindingHandlers.text.update(element, function() 
      { 
       var value: any = ko.utils.unwrapObservable(valueAccessor()); 

       if (value == null) 
       { 
        return null; 
       } 

       if (typeof value === "string") 
       { 
        value = new Date(value); 
       } 

       return value.toShortDateString(); 

      }, allBindingsAccessor, null, null); 
     } 
    }; 

मैं करने के लिए एक प्रोटोटाइप जोड़ने के लिए चुना है:

Shipped on <span data-bind="date: shipDt"></span> 

यहाँ हैंडलर है इस तरह की तिथि वस्तु (और हैंडलर में बनाई गई दिनांक वस्तु पर toShortDateString पर कॉल करें) - लेकिन आप ऊपर दिए गए तर्क को Globalize या जो कुछ भी पसंद करते हैं उसे प्रतिस्थापित कर सकते हैं।

Date.prototype.toShortDateString = function() 
{ 
    return (this.getMonth() + 1) + "/" + this.getDate() + "/" + this.getFullYear(); 
}; 

Answer 4

यदि आप moment.js का संदर्भ दे रहे हैं तो मैं वास्तव में नॉकआउट मॉडल में प्रारूपित होगा।

var BiographicViewModel = function (person) { 
    this.FirstName = ko.observable(person.first_name); 
    this.LastName = ko.observable(person.last_name); 
    this.DOB = ko.observable(moment(person.birth_date).format("MM/DD/YYYY")); 
    this.Gender = ko.observable(person.gender); 
    this.Country = ko.observable(person.country); 
    this.City = ko.observable(person.city);   
}; 

Answer 5

प्रचार प्रारूप समारोह:

Date.prototype.toFormattedDate = function() { 
    var dd = this.getDate(); 
    if (dd < 10) dd = '0' + dd; 
    var mm = this.getMonth() + 1; 
    if (mm < 10) mm = '0' + mm; 
    var yyyy = this.getFullYear(); 
    /* change format here */ 
    return String(mm + "/" + dd + "/" + yyyy); 
}; 

और के रूप में की तारीख तार के साथ उपयोग करें:

<span data-bind="text: new Date(TaxAuthority.RegDate).toFormattedDate()"></span>