How can I collapse automatically specific rows of IgxTreeGrid?

[luiscla27]

Question

I found that expansionDepth = 0 collapses automatically the whole tree. However, I need to collapse automatically only specific rows due to conditions given by row data.

For example, I would like to collapse the level 0 row only when rowData.collapsed is true, my variable collapsed is previously filled from more complex conditions.

• igniteui-angular version: 13.0.1
• browser: Google Chrome Versión 96.0.4664.45 (Build oficial) (64 bits)

[luiscla27]

Another way to paraphrase this question would be "How can I collapse specific rows by code?"

[rkaraivanov]

Get the row from the grid end set it state.

const row = this.grid.getRowByKey(<PK>);
row.collapsed = false;

Additional information here

[luiscla27]

Thank you, I tried using this.grid.records.forEach((...)...) and changed the attribute of the rows I needed to. I do this every time when I know data has changed. But it didn't work.

I found that collapsed is not part of the ITreeGridRecord interface, so I used expanded = false, I still cannot collapse rows from code @rkaraivanov (still testing)

The chevron icon changes from expand_more to chevron_right, but the children rows stay expanded

[luiscla27]

I managed to make it work by calling the set_row_expansion_state method directly:

this._igxTreeGrid.records.forEach((row: ITreeGridRecord) => {
	if (row.data.collapsed) {
		this._igxTreeGrid.gridAPI.set_row_expansion_state(row.key, false);
	}
});

[rkaraivanov]

@luiscla27
Can you give more details on what are you trying to achieve exactly?
The IgxTreeGridRow expanded descriptor already calls set_row_expansion_state when you set it. If that doesn't work then it should be logged as a bug.

[luiscla27]

I'm loading remote-data and data on demand, and after the data is loaded I automatically collapse rows with 1 child. I was testing that as the default behavior for usability purposes as I found it useless to show them because I was already showing a small summary in its parent row. It was just a test.

I ended up trying set_row_expansion_state because I inspected your code and found that the row.expanded setter internally calls it, the issue seems to be that for some reason when called the setter just modifies the chevron icon from expand_more to chevron_right without actually collapsing anything.

I would love to report this as a bug. However, currently, all your stackblitz examples seem to be disabled purposely so I'll wait until they get fixed to test this issue with your latest release.