ng2-handsontable icon indicating copy to clipboard operation
ng2-handsontable copied to clipboard

Column headers don't update

Open daleclements opened this issue 8 years ago • 3 comments

If I create a table and bind the col-headers to a component variable, like [col-headers]="colHeaders", then when I update the component variable colHeaders, the headers of the table don't update.

EDIT: Let me clarify. The headers will take the first assignment, but not any updates to the variable afterwards. The same thing is true of changes to the colHeaders and rowHeaders attributes of the options object. I can assign colHeaders and rowHeaders there, once, but any changes afterwards aren't reflected. so with [options]="options" or with [col-headers]="colHeaders", then the first time I set this.colHeaders=something or this.options.colHeaders=something the grid will update, but not any time after the first.

I'm not sure if this is a bug report or a feature request, but I'd expect them to.

In my use-case, I need to display different grids of different sizes with different headers depending on what the user clicks in some other place in the application.

This is in 0.48 (as 1.0 isn't coming down npm yet). If you need any other info I'd be happy to provide it.

daleclements avatar May 31 '17 17:05 daleclements

I had the same issue and inspected the code. UpdateSettings(...) is only triggered when "options" are updated. I do not use options, but added the following after making changes to headers, columns and widths. It seems to work.

this.options = {};

carlmon avatar Jun 01 '17 12:06 carlmon

Ahh. I'm using options because I need to set row headers as well. Clearing options before every update makes the updates actually work. Thanks.

this.options={}; this.options.rowHeaders = newRowHeaders; this.options.colHeaders = newColumnHeaders;

daleclements avatar Jun 01 '17 14:06 daleclements

Hrm. Unfortunately this doesn't work later on when I try to change the headers after a transpose operation. I do

let newOptions = this.options;
newOptions.colHeaders = this.options.rowHeaders;
newOptions.rowHeaders = this.options.colHeaders;
this.options = null;
this.options = newOptions;

and the headers don't update at all, even though this:

let temp = this.options;
temp.rowHeaders = newRateData.rowHeader;
temp.colHeaders = newRateData.colHeader;
this.options = null;
this.options = temp;

worked just fine to set the headers originally

(I've tried with = null and with = {} )

EDIT: Apparently the second time, ngOnChanges is getting the new data, but not the new options. Don't know why. A workaround is to manually call:

this.hotTable.getHandsontableInstance().updateSettings(this.options);

but at this point I might as well be using original non-ng2-handsontable, right?

daleclements avatar Jul 13 '17 19:07 daleclements