Date formatting on angular 2

Getting help Questions
1

I’m trying to go after the workaround relate to validateCells() for the date formatting issue. I can´t find the way to do that on angular 2. Any insight??

2

For more detailing…

------------------------HTML----------
<hotTable
[data]=“dataSource”
(after-change)=“afterChange($event)”
(after-on-cell-mouse-down)=“afterOnCellMouseDown($event)”
(afterInit)=“afterInit($event)”
[colHeaders]=“colHeaders”
[columns]=“columns”
[options]=“options”
[colWidths]=“colWidths”>

-----------------------TS-------------------
private afterInit(e: any) {
console.log(“Hot table iniciada”);
//this.hotTableComponent.validateCells();

}

The validateCells() method is not recognized… Anyone knows how to do that on angular 2???

3

Hi @felixeu31

Have you used our wrapper for Angular (2)? Repository https://github.com/handsontable/angular-handsontable

4

Hi @aleksandra_budnik

I having the same trouble with date-format in hot-column directive. date-format not working in hot-column directive · Issue #178 · handsontable/ngHandsontable · GitHub

private columns: any = [
{
data: ‘concept’,
renderer: ‘text’,
readOnly: true
},
{
data: ‘value’,
type: ‘numeric’,
format: ‘0.000’
},
{
data: ‘referenceRateDate’,
type: ‘date’,
dateFormat: ‘MM/DD/YYYY’,
correctFormat: true
}
];

This formating is not working as expected. This is what my table looks like:

image.png561×256 17.3 KB

I am trying going after a workaround but i do not know hoy to call validateCells() since in angular (2) i am not able to use this.validateCells(); in angular 2. like the example bellow:

This is what i am trying in my component controller:

private afterInit(e: any) {
console.log(“Hot table iniciada”);
this.hotTableComponent.validateCells(); <--------------this line is not working

}

Note that this.hotTableComponent is the result of using @ViewChild(HotTable) hotTableComponent:HotTable; in my controller in order to acces the hottable methods.

Any idea to progress with this solution???

5

Have you checked if the validateCells() was actually called? You can check it by adding any log to the afterValidate hook that will actually tell you what values it gets.

6

I achieve it!!

I used this:

private afterRender(e: any) {
this.hotTableComponent.getHandsontableInstance().validateCells();
}

This way although the format it is not properly rendered at first I validate the cell just after the render for getting the correct format. (dateFormat: “DD/MM/YYYY”,)

7

Great. Thank you for keeping me updated.

I guess that we can close the issue as it is solved. (It will still be available to read from our archive)