question-mark
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.

[mat-tree]: Nested nodes example fails partially with large number of data (Maximum call stack size exceeded error)

See original GitHub issue

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The error should be caught with a friendly message and the erroneous nodes should not be rendered.

What is the current behavior?

When the data of the tree is greater than a large value (e.g. 200), the application throws RangeError: Maximum call stack size exceeded error and all nodes up to that point are rendered with no content.

What are the steps to reproduce?

Providing a StackBlitz reproduction is the best way to share your issue.
StackBlitz starter: https://goo.gl/wwnhMV
https://stackblitz.com/edit/angular-2qc1cr?file=app/tree-nested-overview-example.ts

  1. Lower the limit to 100 or remove the child property.
  2. The tree is rendered correctly and the error is gone.

What is the use-case or motivation for changing an existing behavior?

N/A

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

Angular 6.0.3 Angular Material: 6.2.0

Is there anything else we should know?

No

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:13
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

5reactions
bampakoacommented, Jun 14, 2018

I attended this talk from ng-conf that suggests to use a flat tree for large amount of data. And it actually worked in my case. So, I am not sure if this is actually a bug or the documentation should be written properly as when to prefer each type of tree.

1reaction
davegadsbycommented, Feb 24, 2022

We are also experiencing this problem, I can’t find any official documentation about what the actual/recommended limit should be.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Angular material - Maximum call stack size exceeded
There is some issue with nested tree nodes and larger amounts of data. Changing the tree to a flat tree resolves the issue....
Read more >
maximum call stack size exceeded angular
This error occur when there is an infinite loop. As you have mentioned that the page loads when app-heroes is commented, this might...
Read more >
The "Maximum call stack size exceeded" error occurs if a ...
I have tried with both plain structure and Hierarchy structure. Same error I am getting. I am able to reproduce error in sample...
Read more >
Database Engine events and errors - SQL Server
Maximum number of tables in a query (%d) exceeded. ... ls' is ambiguous: both a user-defined function and a method call with this...
Read more >
Angular Material Nested Tree - Step-by-Step Example
This video is part of the Angular Material In Depth course - https://angular-university.io/course/angular-material-courseCheck out the PDF ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found