format date in angular example
Example 1: angular date formats
'short': equivalent to 'M/d/yy, h:mm a' (6/15/15, 9:03 AM).
'medium': equivalent to 'MMM d, y, h:mm:ss a' (Jun 15, 2015, 9:03:01 AM).
'long': equivalent to 'MMMM d, y, h:mm:ss a z' (June 15, 2015 at 9:03:01 AM GMT+1).
'full': equivalent to 'EEEE, MMMM d, y, h:mm:ss a zzzz' (Monday, June 15, 2015 at 9:03:01 AM GMT+01:00).
'shortDate': equivalent to 'M/d/yy' (6/15/15).
'mediumDate': equivalent to 'MMM d, y' (Jun 15, 2015).
'longDate': equivalent to 'MMMM d, y' (June 15, 2015).
'fullDate': equivalent to 'EEEE, MMMM d, y' (Monday, June 15, 2015).
'shortTime': equivalent to 'h:mm a' (9:03 AM).
'mediumTime': equivalent to 'h:mm:ss a' (9:03:01 AM).
'longTime': equivalent to 'h:mm:ss a z' (9:03:01 AM GMT+1).
'fullTime': equivalent to 'h:mm:ss a zzzz' (9:03:01 AM GMT+01:00).
Example 2: date format angular
content_copy
@Component({
selector: 'date-pipe',
template: `<div>
<p>Today is {{today | date}}</p>
<p>Or if you prefer, {{today | date:'fullDate'}}</p>
<p>The time is {{today | date:'h:mm a z'}}</p>
</div>`
})
export class DatePipeComponent {
today: number = Date.now();
}
Example 3: Date format in angular ts
public getAllBookings() {
const today = new Date();
const tomorrow = new Date(today.setDate(today.getDate() + 1));
return new Promise((resolve, reject) => {
this.http
.get(
`${this.kioskservice.getAPIUrl()}search/dashboard/${this.kioskservice.LocationGUID()}/?apikey=${this.kioskservice.getAPIKey()}&format=json&from=${this.dateFormat(today)}&until=${this.dateFormat(tomorrow)}&full=true`
)
.toPromise()
.then(
res => {
this.config = res.json()
console.log(res.json());
resolve();
},
msg => {
throw new Error("Couldn't get all Bookings: " + msg);
}
);
});
}
private dateFormat(date: Date) {
const day = date && date.getDate() || -1;
const dayWithZero = day.toString().length > 1 ? day : '0' + day;
const month = date && date.getMonth() + 1 || -1;
const monthWithZero = month.toString().length > 1 ? month : '0' + month;
const year = date && date.getFullYear() || -1;
return `${year}-${monthWithZero}-${dayWithZero}`;
}