This seems to be a simple question. I'm using pipes in my Ionic 2 application for dates format. This is the recieved webservice reponse.
[
{
"MessageID": 544882,
"CategoryID": 1,
"DateSent": "2015-05-18T02:30:56",
"Title": "Jobseeker App",
"MessageContent": "Hi Test guy just started to use the app..",
"Sender": null,
"Recipient": null,
"DateReceived": null,
"DateRead": "2015-05-18T02:30:56",
"Note_Direction": "sent",
"Viewed": 0,
"AppointmentDateTime": null,
"MessageAttachments": [
]
},
{
"MessageID": 544886,
"CategoryID": 1,
"DateSent": "2015-05-18T02:42:45",
"Title": "Jobseeker App",
"MessageContent": "App",
"Sender": null,
"Recipient": null,
"DateReceived": null,
"DateRead": "2015-05-18T02:42:45",
"Note_Direction": "sent",
"Viewed": 0,
"AppointmentDateTime": null,
"MessageAttachments": [
]}
]
This is the code snippet I'm using.
<div class="Date">
<label class="time">{{appointment.DateSent | date:"HH"}}:{{appointment.DateSent| date:"mm"}}</label>
<label class="month">{{appointment.DateSent| date:"MMM"}}</label>
<label class="day">{{appointment.DateSent| date:"dd"}}</label>
<label class="year">{{appointment.DateSent| date:"yyyy"}}</label>
</div>
Error:
Invalid argument '2015-05-18T02:30:56' for pipe 'DatePipe' in [{{appointment.DateSent | date:"HH"}}:{{appointment.DateSent| date:"mm"}} in AppointmentsPage@14:37]
I need to get a date format like this:
06:05
Dec
24
2015
You are passing wrong parameters so angular throwing error. changed your date code with this:
Here I am using variable
birthday
instead of your variable name. Maybe the reason for the error is angular may not accept the format of date as a string. according to me. But as officialsworking plnkr http://plnkr.co/edit/b9Z090rQpozMoMi0BWaY?p=preview
update :
As Needed by @Kanishka yes you can update your date and transform into
new date()
from HTML side you have to call the setter and getter function of typescript for the same. here is an example of what you are looking for. so by using this, I don't think you have to need to create your own array from the response. I hope it may help you and suggest you one new method to play with the response from the front End.here is Updated working demo http://plnkr.co/edit/rHCjevNcol12vwW6B38u?p=preview