How to format date in angularjs

Question

Angular.js has a built-in date filter.

demo

// 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

You can see the supported date formats in the source for the date filter.

edit:

If you're trying to get the correct format in the datepicker (not clear if you're using datepicker or just trying to use it's formatter), those supported format strings are here: https://api.jqueryui.com/datepicker/

If you are not having an input field, rather just want to display a string date with a proper formatting, you can simply go for:

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

and in the js file use:

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

This will convert the date in string to a new date object in javascript and will display the date in format MM/dd/yyyy.

Output: 12/15/2014

Edit
If you are using a string date of format "2014-12-19 20:00:00" string format (passed from a PHP backend), then you should modify the code to the one in: https://stackoverflow.com/a/27616348/1904479

Adding on further
From javascript you can set the code as:

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

that is in case you already have a date with you, else you can use the following code to get the current system date:

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

For more details on date Formats, refer : https://docs.angularjs.org/api/ng/filter/date

I am using this and it is working fine.

{{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

This isn't really exactly what you are asking for - but you could try creating a date input field in html something like:

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

Then to print this on the page you would use:

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

Finally, in my controller I declared a method that creates a date from the input value (which in chrome is apparently parsed 1 day off):

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

So there you have it. To see the whole thing working see the following plunker: http://plnkr.co/edit/8MVoXNaIDW59kQnfpaWW?p=preview .Best of luck!

This will work:

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

NOTE: once you replace these then remaining date/millis will be converted to given foramt.

I use filter

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

then

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

see angular date api : AngularJS API: date

---

The Angular - date filter:

Usage:

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

Exampe:

Code:

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

Result:

10/29/2010