एंगुलरज में दिनांक को कैसे प्रारूपित करें

Question

मैं दिनांक को प्रारूपित करना चाहता हूं mm/dd/yyyy। मैंने निम्नलिखित की कोशिश की और इसमें से कोई भी मेरे लिए काम नहीं करता है। क्या कोई मुझे इस बारे में सहायता कर सकता है?

संदर्भ: ui- तारीख

<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" /> 

<input type="date" ng-model="valueofdate" />

Comments

क्या आपने ui-date-format="mm/dd/yyyy"पूरी तरह से हटाने की कोशिश की है ? यह इस विकल्प के बिना डिफ़ॉल्ट व्यवहार जैसा दिखता है कि आप क्या चाहते हैं।

— लुकास

क्या आपने पल-पल की कोशिश की है।

— सेटिया

नहीं, मैंने क्षण भर की कोशिश नहीं की है। मेरा सर्वर मुझे Json string 20140313T00: 00: 00 लौटाता है। मैंने html5 इनपुट टाइप डेट और यूआई-डेट-फॉर्मेट दोनों को आजमाया। Ui-date-format को हटा दें तो कहते हैं कि यह एक स्ट्रिंग है इसे एक प्रारूप दें।

— उपयोगकर्ता 16

का उपयोग करते हुए $formattersऔर $parsersप्रति इस जवाब मेरे समान समस्या हल हो।

— रॉस रोजर्स

आप HTML के साथ-साथ जावास्क्रिप्ट से भी फ़िल्टर का उपयोग कर सकते हैं, कृपया देखें: stackoverflow.com/a/27615392/1904479

— कैलास

Answer 1

Angular.js में एक अंतर्निहित तिथि फ़िल्टर है।

डेमो

// in your controller:
$scope.date = '20140313T00:00:00';

// in your view, date property, filtered with date filter and format 'MM/dd/yyyy'
<p ng-bind="date | date:'MM/dd/yyyy'"></p>

// produces
03/13/2014

आप दिनांक फ़िल्टर के लिए स्रोत में समर्थित दिनांक प्रारूप देख सकते हैं ।

संपादित करें :

यदि आप डेटकपर में सही प्रारूप प्राप्त करने की कोशिश कर रहे हैं (स्पष्ट नहीं है कि आप डेटकपर का उपयोग कर रहे हैं या सिर्फ फॉर्मेटर का उपयोग करने की कोशिश कर रहे हैं), तो वे समर्थित प्रारूप स्ट्रिंग यहां हैं: https://api.jqueryui.com/datepicker/

Comments

सर्वर मुझे '20140313T00: 00: 00 देता है और मैं इस तरह के इनपुट में mm / dd / yyyy प्रारूप में दिखाना चाहता हूं - <input type = date "ng-model =" mydate ">

— user16

मुझे यकीन नहीं है कि मेरा जवाब क्यों नहीं दिया गया। यह उत्तर लगभग कोणीय के डॉक्स से लिया गया है। JQueryUI datepicker प्रारूप तार का उल्लेख है क्योंकि सवाल में इस्तेमाल किया जा रहा मॉड्यूल ui-date है जो jQuery और jQueryUI पर निर्भरता है। उत्तर में कुछ भी गलत या भ्रामक नहीं है।

— जिम स्कुबर्ट

मुझे नहीं लगता कि प्रारूप स्ट्रिंग्स के लिए jQuery UI लिंक सही है। docs.angularjs.org/api/ng/filter/date अधिक सटीक प्रतीत होता है।

— ट्रूविल सेप

@TrueWill ओपी विशेष रूप से यूआई-डेट के बारे में पूछ रहा है, जो jQuery डेटपिकर का उपयोग करता है। मेरी पोस्ट की पहली कड़ी सोर्स कोड से लिंक है जिसमें कोणीय द्वारा समर्थित प्रारूप स्ट्रिंग है।

— जिम शूबर्ट

@JimSchubert यह मेरी तारीख स्ट्रिंग '2013-11-11 00:00:00' है और यह परिवर्तित नहीं होगी | दिनांक: 'longdate', कोई सुझाव?

— अल्फपिलग्रीम

Answer 2

यदि आपके पास कोई इनपुट फ़ील्ड नहीं है, तो बस एक उचित प्रारूपण के साथ एक स्ट्रिंग दिनांक प्रदर्शित करना चाहते हैं, तो आप बस इसके लिए जा सकते हैं:

<label ng-bind="formatDate(date) |  date:'MM/dd/yyyy'"></label>

और जेएस फ़ाइल के उपयोग में:

    // @Function
    // Description  : Triggered while displaying expiry date
    $scope.formatDate = function(date){
          var dateOut = new Date(date);
          return dateOut;
    };

यह तारीख को स्ट्रिंग को एक नई तिथि ऑब्जेक्ट में जावास्क्रिप्ट में रूपांतरित करेगा और दिनांक को प्रारूप MM / dd / yyy में प्रदर्शित करेगा।

आउटपुट: 12/15/2014

संपादित करें
यदि आप "2014-12-19 20:00:00" प्रारूप का एक स्ट्रिंग दिनांक (PHP बैकएंड से पारित) का उपयोग कर रहे हैं, तो आपको कोड को एक में संशोधित करना चाहिए: https://stackoverflow.com / एक / 27616348/1904479

आगे जोड़ना
जावास्क्रिप्ट से आप कोड को इस प्रकार सेट कर सकते हैं:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(dateValue),'yyyy-MM-dd');

यदि आपके पास पहले से ही एक तारीख है, तो आप वर्तमान सिस्टम तिथि प्राप्त करने के लिए निम्नलिखित कोड का उपयोग कर सकते हैं:

$scope.eqpCustFields[i].Value = $filter('date')(new Date(),'yyyy-MM-dd');

दिनांक प्रारूप पर अधिक जानकारी के लिए, देखें: https://docs.angularjs.org/api/ng/filter/date

Answer 3

मैं इसका उपयोग कर रहा हूं और यह ठीक काम कर रहा है।

{{1288323623006 | date:'medium'}}: Oct 29, 2010 9:10:23 AM
{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}: 2010-10-29 09:10:23 +0530
{{1288323623006 | date:'MM/dd/yyyy @ h:mma'}}: 10/29/2010 @ 9:10AM
{{1288323623006 | date:"MM/dd/yyyy 'at' h:mma"}}: 10/29/2010 at 9:10AM

Comments

यह मेरे लिए काम नहीं करता है, अगर मैं जेएस दिनांक वस्तु पास करता हूं। कोई सुझाव क्यों?

— पैंशुल

यह केवल उस दिनांक स्वरूप के लिए कार्य करना चाहिए जहाँ दिनांक मिलीसेकंड में है और आपके मामले में दिनांक दिनांक फ़ॉर्मेट में है। अनुसरण करें: w3schools.com/js/js_date_formats.asp

— रविंद्र

Answer 4

यह वास्तव में वैसा नहीं है जैसा आप पूछ रहे हैं - बल्कि आप HTML में एक तारीख इनपुट क्षेत्र बनाने की कोशिश कर सकते हैं जैसे कि:

<input type="date" ng-model="myDate" />

फिर इस पृष्ठ पर प्रिंट करने के लिए जिसका आप उपयोग करेंगे:

<span ng-bind="convertToDate(myDate) | date:'medium'"></span>

अंत में, मेरे नियंत्रक में मैंने एक विधि घोषित की जो इनपुट मूल्य से एक तिथि बनाता है (जो क्रोम में जाहिरा तौर पर 1 दिन बंद है):

$scope.convertToDate = function (stringDate){
  var dateOut = new Date(stringDate);
  dateOut.setDate(dateOut.getDate() + 1);
  return dateOut;
};

इसलिए यह अब आपके पास है। पूरी चीज़ को काम करते हुए देखने के लिए निम्न प्लंकर देखें: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview ।

Answer 5

यह काम करेगा:

{{ oD.OrderDate.replace('/Date(','').replace(')/','') | date:"MM/dd/yyyy" }}

ध्यान दें: एक बार जब आप इन्हें बदल देते हैं तो शेष तिथि / मिली को दिए गए फॉरम में बदल दिया जाएगा।

Comments

किसी कारण से मेरा क्षेत्र इस प्रारूप / दिनांक (99999) / में है, क्या आप जानते हैं कि क्यों?

— एंटोनियो कोर्रेया

Answer 6

कोणीय dateएपीआई देखें : कोणीयजेएस एपीआई: तारीख

---

कोणीय - dateफ़िल्टर:

उपयोग:

{{ date_expression | date  [: 'format']  [: 'timezone' ] }}

exampe:

कोड:

 <span>{{ '1288323623006' | date:'MM/dd/yyyy' }}</span>

परिणाम:

10/29/2010

Answer 7

मैं फिल्टर का उपयोग करता हूं

.filter('toDate', function() {
  return function(items) {
    return new Date(items);
  };
});

फिर

{{'2018-05-06 09:04:13' | toDate | date:'dd/MM/yyyy hh:mm'}}

Answer 8

बस अपने सर्वर साइड कोड से क्लाइंट साइड में UTC तिथि प्रारूप पास करें

और वाक्य रचना के नीचे का उपयोग करें -

 {{dateUTCField  +'Z' | date : 'mm/dd/yyyy'}}

 e.g. dateUTCField = '2018-01-09T10:02:32.273' then it display like 01/09/2018

Answer 9

उपरोक्त सभी समाधानों को देखने के बाद, निम्नलिखित मेरे लिए सबसे तेज समाधान था। यदि आप कोणीय सामग्री का उपयोग कर रहे हैं:

 <md-datepicker ng-model="member.reg_date" md-placeholder="Enter date"></md-datepicker>

प्रारूप सेट करने के लिए:

app.config(function($mdDateLocaleProvider) {
    $mdDateLocaleProvider.formatDate = function(date) {
        // Requires Moment.js OR enter your own formatting code here....
        return moment(date).format('DD-MM-YYYY');
    };
});

संपादित करें: आपको एक तिथि में टाइप करने के लिए पार्सडेट सेट करने की आवश्यकता है (इस उत्तर से md-datepicker के कोणीय सामग्री में बदलें प्रारूप )

$mdDateLocaleProvider.parseDate = function(dateString) {
    var m = moment(dateString, 'DD/MM/YYYY', true);
    return m.isValid() ? m.toDate() : new Date(NaN);
};

Answer 10

var app=angular.module('myApp',[]);
        app.controller('myController',function($scope){         
              $scope.names = ['1288323623006','1388323623006'];

        });

यहां कंट्रोलर का नाम "myController" है और ऐप का नाम "myApp" है।

<div ng-app="myApp" ng-controller="myController">
        <ul>
            <li ng-repeat="x in names">
                {{x | date:'mm-dd-yyyy'}}

            </li>

        </ul>
    </div>

परिणाम इस तरह दिखाई देगा: - * 10-29-2010 * 01-03-2013

Answer 11

: ठीक है इस मुद्दे को ऐसा लगता है इस लाइन से आने के लिए
https://github.com/angular-ui/ui-date/blob/master/src/date.js#L106 ।

वास्तव में यह लाइन jQuery UI के साथ बाध्यकारी है जो इसे डेटा प्रारूप को इंजेक्ट करने के लिए जगह होनी चाहिए।

जैसा कि आप देख सकते हैं कि एनजी-तारीख-प्रारूप से मूल्य के साथ var optsकोई संपत्ति नहीं है जैसा कि आप dateFormatजासूसी कर सकते हैं।

वैसे भी निर्देश में uiDateConfigगुणों को जोड़ने के लिए एक स्थिर कहा जाता है opts।

लचीला समाधान (अनुशंसित):

से यहाँ आप कुछ विकल्प jQuery ui विकल्पों के साथ निर्देश एक नियंत्रक चर में इंजेक्शन लगाने के सम्मिलित कर सकते हैं देख सकते हैं।

<input ui-date="dateOptions" ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />

myAppModule.controller('MyController', function($scope) {
    $scope.dateOptions = {
        dateFormat: "dd-M-yy"
    };
});

हार्डकोड समाधान:

यदि आप इस प्रक्रिया को हर समय दोहराना नहीं चाहते हैं, तो uiDateConfigdate.js के मान को बदल दें:

.constant('uiDateConfig', { dateFormat: "dd-M-yy" })

Answer 12

मेरे पास एक ही मुद्दा था और उपरोक्त टिप्पणियों के रूप में, सोचा कि जावास्क्रिप्ट में एक मूल विधि होनी चाहिए। बात यह है कि new Date(valueofdate)रिटर्न एक दिनांक वस्तु।

लेकिन, http://www.w3schools.com/js/js_date_formats.asp में चेक करें , वह हिस्सा जो प्रमुख शून्य कहता है। स्ट्रिंग से एक तिथि, उदाहरण के लिए PHP से एक प्रतिध्वनि, जैसे होनी चाहिए:

$valueofdate = date('Y-n-j',strtotime('theStringFromQuery'));

यह एक स्ट्रिंग को पारित करेगा, उदाहरण के लिए: '1999-3-3'और जावास्क्रिप्ट ऑब्जेक्ट को सही प्रारूप के साथ पार्सिंग करेगा

$scope.valueofdate = new Date(valueofdate);

<input ui-date ui-date-format="mm/dd/yyyy" ng-model="valueofdate" />
<input type="date" ng-model="valueofdate" />

तारीख प्रारूपों के लिए PHP के लिए लिंक: http://www.w3schools.com/php/func_date_date_format.asp ।

Answer 13

ng-bind="reviewData.dateValue.replace('/Date(','').replace(')/','') | date:'MM/dd/yyyy'"

इस का उपयोग करें अच्छी तरह से काम करना चाहिए। :) रिव्यूडैडाटा और डेटवैल्यू फील्ड में बदलाव हो सकते हैं क्योंकि आपके पैरामीटर बाकी को समान छोड़ा जा सकता है

Answer 14

{{convertToDate  | date :  dateformat}}                                             
$rootScope.dateFormat = 'MM/dd/yyyy';

Comments

आप अपने उत्तर में उसी पंक्ति के साथ टिप्पणी क्यों करते हैं? और आपका जवाब केवल कुछ कोड है, कोई स्पष्टीकरण नहीं है।

— पोचमर्निक

Answer 15

// $scope.dateField="value" in ctrl
<div ng-bind="dateField | date:'MM/dd/yyyy'"></div>