CODEWITHSUNDEEP
javascriptangular
kumara
kumara

Reputation: 937

json date format using angular javascript

I am trying to display json data the html table. When i run my file, date appear as '2018-11-21T00:00:00.000+0000' in my table. But i need to display only '2018-11-21'. how i do it? can u help my to split it.

import { Certificate } from './certificate';

export const CERTIFICATES: Certificate[] = [
    { date: '2018-11-21T00:00:00.000+0000', ident: 'Fe', moy_certified: 0.297 },
    { date: '2018-11-22T00:00:00.000+0000', ident: 'Cu', moy_certified: 0.04 },
    { date: '2018-11-23T00:00:00.000+0000', ident: 'Mn', moy_certified: 0.0374 }, 
    { date: '2018-11-24T00:00:00.000+0000', ident: 'V', moy_certified: 0.019 },
    { date: '2018-11-25T00:00:00.000+0000', ident: 'Mn', moy_certified: 0.037 }
];
<ul class="cert-result">
    <li *ngFor="let certificate of certificates">
      <table>
        <tr>
          <th>Date</th>
          <th>Element</th>
          <th>Composition</th>
        </tr>
        <tr>
          <td>{{certificate.date}}</td>
          <td>{{certificate.ident}}</td>
          <td>{{certificate.moy_certifiee}}</td>
        </tr>
      </table>
    </li>
  </ul>

Upvotes: 1

Views: 135

Answers (2)

Mamun
Mamun

Reputation: 68933

You can use Pipes (|):

Introducing Angular pipes, a way to write display-value transformations that you can declare in your HTML.

A pipe takes in data as input and transforms it to a desired output.

Change

<td>{{certificate.date}}</td>

To

<td>{{certificate.date | date:'yyyy-MM-dd'}}</td>

Upvotes: 3

Sang Huynh
Sang Huynh

Reputation: 241

2 options for you:

  1. You can use Angular filter by date https://docs.angularjs.org/api/ng/filter/date
  2. (new Date(certificate.date)).toLocaleDateString();

Upvotes: 1

Related Questions