Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

tree.treeControl.expandAll() has an error

See original GitHub issue

Bug

Dear team! I has an error when I want to expand all node of Mat nested tree

ERROR TypeError: Cannot read property 'reduce' of undefined
    at NestedTreeControl.push../node_modules/@angular/cdk/esm5/tree.es5.js.NestedTreeControl.expandAll (tree.es5.js:287)
    at Object.eval [as handleEvent] (FilterViewComponent.html:18)
    at handleEvent (core.js:10050)
    at callWithDebugContext (core.js:11143)
    at Object.debugHandleEvent [as handleEvent] (core.js:10846)
    at dispatchEvent (core.js:7509)
    at core.js:7953
    at HTMLButtonElement.<anonymous> (platform-browser.js:1140)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3748)

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 6.1.0 Material 6.4.1

Issue Analytics

State:
Created 5 years ago
Reactions:17
Comments:13 (4 by maintainers)

Top GitHub Comments

57reactions

devversioncommented, Aug 4, 2018

This is not a very friendly exception. I’ve created a PR that should improve that.

For now though, you need to somehow set the treeControl.dataNodes property to the current data from your data source. sample code:

myDataObservable.subscribe(data => {
  this.dataSource.data = data
  this.treeControl.dataNodes = data;
});

6reactions

emilio-martinezcommented, Dec 3, 2018

Ran into this trying to do expandAll().

Setting the data twice as @DevVersion mentioned above works but is kind of an odd and error-prone API, in mo opinion. I’d expect the data source and the tree control to be more in sync rather than coordinating their data sources somewhat manually like that. The method shown above to expand a single method shown above (nestedTreeControl.expand) also is kind of odd—only because requires retroactively looking for a node to pass it to the tree control.

Perhaps the API needs some better tooling around programmatically expanding nodes? The UI part of this story is much smoother.

Top Results From Across the Web

Error while trying make a button collapse/expand Angular ...

I have a Angular Material Nested tree. I'm trying to create a button to expand/collapse, but I'm getting the following error:

Tree | Angular Material

Base tree control. It has basic toggle/expand/collapse operations on a single data node. Properties. Name, Description.

Expand All and Collapse All Controls | Angular - EJ 2 Forums

Yes, you can select or expand a tree node inside ngOnInit() lifecycle ... We have analyzed your issue "ERROR TypeError: Cannot set property ......

Tree.ExpandAll() Does not seem to work - Ranorex Forum

When I have a valid tree control and I try to use the ExpandAll() method ... time I edit and build my code...

Top 5 @angular/material Code Examples - Snyk

... nested node with more than 1 if(this.menus.some(a => ObjectUtils.isNotNull(a.subMenus) && a.subMenus.length > 0)){ this.tree.treeControl.expandAll() } }.