angular-tree-component icon indicating copy to clipboard operation
angular-tree-component copied to clipboard

Missing documentation for how to use checkbox tri-state in a custom template

Open stuartngreen opened this issue 2 years ago • 2 comments

I'm not sure if this is just missing or it can't be done, but it seems like an oversight.

I would like to use the checkboxes with the tri-state functionality (parent child relationship) but within a custom template. I tried to assign the node.toggleSelected() method to the (change) event on a checkbox in a node, but it doesn't work (the toggleSelected() method is also missing from the Tree Node API reference page but it definitely exists).

The examples on the custom templates page which contain checkboxes don't have this tri-state functionality working... any help would be much appreciated.

stuartngreen avatar Mar 13 '22 15:03 stuartngreen

Hi @stuartngreen, I came across the same issue as you. It can simply be solved by using the following template for checkbox in your node's custom template: <input class="tree-node-checkbox" type="checkbox" (click)="node.mouseAction('checkboxClick', $event)" [checked]="node.isSelected" [indeterminate]="node.isPartiallySelected" />

Hope it helps!

madman-maverick avatar Sep 26 '22 08:09 madman-maverick

Thanks @madman-maverick I ended up writing a whole new checkbox tree because performance wasn't so good with thousands of checkboxes. But your reply will help someone I'm sure!

stuartngreen avatar Sep 26 '22 11:09 stuartngreen