Question

145

Unable to format default MySQL datetime

rated 0 times [ 147] [ 2] / answers: 1 / hits: 22183 / 11 Years ago, fri, december 20, 2013, 12:00:00

My dates come out of the database looking like this: 2013-11-21 17:43:20

I'm trying to user Angular's date filter to turn them into something prettier, but...

{{Objected.created | date:'shortDate'}}

or

{{Objected.created | date:'YYYY'}}

...just spits out the original datetime string: 2013-11-21 17:43:20. There are no errors. What am I doing wrong?

Update
I see that MySQL's default datetime is incompatible with what Angular's data filter expects. I'm attempting to convert it on the fly like this but it's throwing errors:

<li ng-repeat=result in data>{{ new Date(result.Job.created).toISOString() | date:'shortDate'}}</li>

I suspect I can't instantiate the Date class in the way I'm trying. The error is a $parse:syntax error.

Update

Thanks to @m59's help, I got it working with a few minor adjustments...

HTML:

<html ng-app=myApp>

...

{{Object.created | dateToISO | date:'shortDate'}}

JS:

var myApp = angular.module('myApp',[]);



myApp.filter('dateToISO', function() {

  return function(input) {

    input = new Date(input).toISOString();

    return input;

  };

});

This custom filter converts the default MySQL datetime into the format that the date filter expects, so I send it throw one then another and voila.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

gianni

Add To Favorites

Follow

Total Points: 307

Total Questions: 104

Total Answers: 96

Location: South Georgia

Member since Sun, Aug 8, 2021

3 Years ago

answered 11 Years ago stephonkeandrer · Accepted Answer

You need to convert your date string to something supported by Angular, like ISO 8601 format. You could convert it like this:

$scope.Object.created = new Date($scope.Object.created).toISOString();

Live demo here (click).

To do this on the fly, you need a custom filter. Live demo here (click).

Markup:

<div>{{Object.created | dateToISO | date:'shortDate'}}</div>

JavaScript:

app.filter('dateToISO', function() {

  return function(input) {

    return new Date(input).toISOString();

  };

});

Update:

Here's a simple way to convert your date manually (firefox):

app.filter('badDateToISO', function() {

  return function(badTime) {

    var goodTime = badTime.replace(/(.+) (.+)/, $1T$2Z);

    return goodTime;

  };

});