New to Kendo UI for Angular? Start a free 30-day trial
Dates Are Formatted As Strings in the Grid
Environment
Product | Progress® Kendo UI® for Angular Grid |
Description
Even though I apply a format to the dates in the Grid, the dates are not rendered correctly.
Cause
When the Grid data contains dates, they have to be instances of the JavaScript Date
object. This ensures that dates are formatted properly as dates and not as strings.
Solution
If the remote server returns serialized data or the data contains string representations of dates, map the data so that each "date"
property has a Date
JavaScript object as a value.
ts
protected fetch(tableName: string, state: any): Observable<GridDataResult> {
const queryStr = `${toODataString(state)}&$count=true`;
return this.http
.get(`${this.BASE_URL}${tableName}?${queryStr}`)
.pipe(
map(response => (<GridDataResult>{
data: response['value'].map(item => {
item.dateField = new Date(item.dateField);
return item;
}),
total: parseInt(response['@odata.count'], 10)
}))
);
}