web-dev-qa-db-fra.com

Argument non valide 'format de date' pour le canal 'DatePipe'?

Cela semble être une question simple. J'utilise des tuyaux dans mon Ionic 2 pour le format des dates. Il s'agit de la réponse du service Web reçue.

 [
  {
    "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": [

    ]}
   ]

Ceci est l'extrait de code que j'utilise.

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

Erreur:

Invalid argument '2015-05-18T02:30:56' for pipe 'DatePipe' in [{{appointment.DateSent | date:"HH"}}:{{appointment.DateSent| date:"mm"}} in AppointmentsPage@14:37]

J'ai besoin d'obtenir un format de date comme celui-ci:

06:05
Dec
24
2015
angulardate-formationic2pipes-filters
9
happycoder

Vous passez des paramètres incorrects donc angular. A changé votre code de date avec ceci:

birthday = 2015-05-18T02:30:56 //Working
birthday2 = new Date(2015-05-18T02:30:56) //Working

Oldbirthday = '2015-05-18T02:30:56'  //Not Working

Ici, j'utilise la variable birthday au lieu de votre nom de variable. Peut-être que la raison de l'erreur est angular peut ne pas accepter le format de la date comme une chaîne. Selon moi. Mais en tant que fonctionnaires

  • ce canal est marqué comme pur, il ne sera donc pas réévalué lorsque l'entrée est mutée. Au lieu de cela, les utilisateurs doivent traiter la date comme un objet immuable et modifier la référence lorsque le tuyau doit être réexécuté (afin d'éviter de reformater la date à chaque cycle de détection de modification, ce qui serait une opération coûteuse). https://angular.io/docs/ts/latest/api/common/DatePipe-class.html

plnkr de travail http://plnkr.co/edit/b9Z090rQpozMoMi0BWaY?p=preview

mise à jour :

Comme requis par @Kanishka oui, vous pouvez mettre à jour votre date et vous transformer en new date() du côté HTML, vous devez appeler la fonction setter et getter de TypeScript pour la même chose. voici un exemple de ce que vous recherchez. donc en utilisant cela, je ne pense pas que vous ayez besoin de créer votre propre tableau à partir de la réponse. J'espère que cela peut vous aider et vous suggérer une nouvelle méthode pour jouer avec la réponse du front end.

<label>{{setDate('2015-05-18T02:30:56') | date:"yyyy"}}</label>

  get Anotherdate(){  //getter function
    return this.date
  }
  setDate(date) {
    this.Anotherdate = date;
    return this.Anotherdate;
  }
  set Anotherdate(date){     // Setter Function
    this.abc = new Date(date)
  }

voici la démo de travail mise à jour http://plnkr.co/edit/rHCjevNcol12vwW6B38u?p=preview

7
Pardeep Jain