Angular Material Tree with checkboxes - get checked and indeterminated value

Question

I've got almost 1 to 1 tree from this example: https://stackblitz.com/angular/nnxeaxmrdob?file=src%2Fapp%2Ftree-checklist-example.ts

What i need is to get all the selected values and those which are indeterminate. I know, that all selected values are hold in checklistSelection variable, however the problem is when the whole child node is selected, and I've got array of parents and children, but while only some children are selected, then I don't have parents.

So once again, how do i get values that are selected AND indeterminate?

Yes, UI works. But HOW do I get objects that are selected AND indeterminate. — lemek, Nov 15 '19 at 16:10
Well you have `this.checklistSelection.selected` which holds selected state. Its quite hard to answer without explaining how flat tree works. Try to split your question into few other questions — Julius Dzidzevičius, Nov 15 '19 at 16:23
Yes I do have this.checklistSelection.selected, but this array does not hold the value of indeterminate checkboxes. My problem lays in the inconsistency, because when all children are selected, the parent is also selected, and is in this.checklistSelection.selected, but if there are just some children selected, the parent is absent in this.checklistSelection.selected because its status is "indeterminated" not selected. — lemek, Nov 15 '19 at 16:32
It holds all selected nodes. They all come in one array and in order. Level 0 parent, level 1 child — Julius Dzidzevičius, Nov 15 '19 at 16:50
Yes, I do know that. However it does not hold "Indeterminate" - this checkboxes with hyphens :) And I need them very, very badly :) — lemek, Nov 15 '19 at 17:41

score 4 · Accepted Answer · answered Nov 15 '19 at 18:45

In the example, you can use

const partial=this.treeControl.dataNodes
    .filter(x=>this.descendantsPartiallySelected(x))

console.log(this.checklistSelection.selected,partial)

Where (*)

   descendantsPartiallySelected(node: TodoItemFlatNode): boolean {
    const descendants = this.treeControl.getDescendants(node);
    const result = descendants.some(child => this.checklistSelection.isSelected(child));
    return result && !this.descendantsAllSelected(node);
  }

(*)You has yet this function in the example

Angular Material Tree with checkboxes - get checked and indeterminated value

1 Answers1