how to declare a date attribute on angular2 model

Question

I'm using Rails 5 + Angular2 to make a web application and I have a model called "Books". My problem, is that I have a file called "books.ts" that has the code:

export class Book {
id: number;
author_one: string;
author_two: string;
author_three: string;
title: string;
subtitle: string;
publisher: string;
year: date;
city: string;
edition: number;
volume: number;
pages: number;
ISBN: string;
barcode: string;
}

But when I run "ng serve --port 9000" I got the following error:

Cannot find name 'date'.

Before I was having the same problem with other attributes, because I was using "integer", but I changed it to "number" and it worked, so I'm wondering if it's a question of Angular not understanding certain types of attributes. But after searching the internet I have not found how to declare a variable of type "date" in Angular. Is there any way to declare the variable of type date? Or should I use a string and have some sort of treatment to use it as a date?

Answer 1

This is a typescript question. There is not a date type in typescript. You can use Date to indicate a native javascript Date object, but this is just the typing of the field. Angular/TS won't do any magic for you to coerce your value into a Date object. If your data is coming from a JSON source, dates are usually just strings (JSON doesn't support date objects).

Answer 2

You can use moment.js for easier way.

import { Moment } from 'moment';

export class Book {
    id: number;
    author_one: string;
    author_two: string;
    author_three: string;
    title: string;
    subtitle: string;
    publisher: string;
    year: Moment;
    city: string;
    edition: number;
    volume: number;
    pages: number;
    ISBN: string;
    barcode: string;
}

Answer 3

Please check the supported data-types in typescript.

https://www.typescriptlang.org/docs/handbook/basic-types.html

date datatype is not available there. you can use string or any datatype according to your requirement.

Answer 4

Use JS Date instead

{
  id: string;
  name: string;
  description: string;
  status: number;
  active_from: Date;
  active_till: Date;
  data: any = {};
  created_at: Date;
  updated_at: Date;
}

and initialize it as

{ 
  id: "abc123", 
  name: "Some name",
  description: "Some description",
  status: 1,
  active_from: new Date("Fri Dec 08 2019 07:44:57"),
  active_till: new Date("Fri Dec 08 2020 07:44:57"),
  data: {},

  created_at: new Date("Fri Dec 08 2019 07:44:57"),
  updated_at: new Date("Fri Dec 08 2019 07:44:57"),
}