在Angular中将日期格式从yyyy / MM / dd更改为MM / dd / yyyy

Question

1st attempt , did this:

{{ leads.pgDate | date:'MM/dd/yyyy' }}

I've also tried:

" | date:"MM/dd/yyyy": 'UTC' "

2nd attempt , went to leadsCtr.js and found

$scope.leadsGridOptions = { 
  columnDefs: [ 
    {
      field: 'expected',
      displayName: 'Expected Close Date', width: 150, type: 'date',
cellFilter: 'date:\'MM/dd/yyyy\'' 
    }
  ]
}

Added 'type:''date'' and changed cellFilter from \\'sort\\'

Observations:

displayName: 'Expected Close Date' BUT the date header in HTML is 'Date of Purchase' - that's why the 2nd attempt didn't work. Also, cellFilter is being overridden, that addition didn't alter anything either.

{{leads.pgDate.toString()}} 

adding toString didn't change anything- Maybe date is a string?!

New Problem:

Cannot find the object that ng-repeat is using to populate the fields to see if the date really is a string and I can parse it.

Questions:

If date is coming in as String, will the angular filter not work? Is there anyway to override {{inside the HTML}} ?

Answer:

Used Jimbrooism's suggestion. The wrapper is converting the value back into a date format and the filter works.

Answer 1

Try This {{convertDate(leads.pgDate) | date:'dd/MMM/yyyy'}}

//JS

$scope.convertDate = function convertDate(date){
    return new Date(date);
};

Answer 2

if you getting date as a string yyyy-mm-dd then convert this into java script date obj. After convert it into date obj it is easy to convert into any format. for mm-dd-yyyy format see this link How to get current formatted date dd/mm/yyyy in Javascript and append it to an input

Answer 3

I suggest to use moment and angular moment for date related stuff.

In the controller:

$scope.date = moment(<date>, 'YYYY/MM/DD');

In the view:

<p data-ng-bind="date | amDateFormat : 'MM/DD/YYYY'"></p>