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.

Router: RC6 loadChildren callback causes RangeError: Maximum call stack size exceeded

See original GitHub issue

I’m submitting a … (check one with “x”)

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior App loads main module but then throws RangeError: Maximum call stack size exceeded exception when it tries to load another module on the route.

RangeError: Maximum call stack size exceeded
    at MergeMapSubscriber._tryNext (mergeMap.ts:120)
    at MergeMapSubscriber._next (mergeMap.ts:108)
    at MergeMapSubscriber.Subscriber.next (Subscriber.ts:95)
    at ScalarObservable._subscribe (ScalarObservable.ts:51)
    at ScalarObservable.Observable.subscribe (Observable.ts:95)
    at Observable._subscribe (Observable.ts:155)
    at MergeMapOperator.call (mergeMap.ts:82)
    at Observable.subscribe (Observable.ts:93)
    at Observable._subscribe (Observable.ts:155)
    at MergeMapOperator.call (mergeMap.ts:82)
const routes: Routes = [
  {
    path: "",
    component: "ChildComponent",
    loadChildren: () => ChildModule
  }
];

The same happens if I set the new “initialNavigation” option on the route options to false and with a delayed call to router.initialNavigation();

Expected/desired behavior The child module should load and the component rendered

Reproduction of the problem If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).

I’ve made a Plunker here: https://plnkr.co/edit/au7M3UG1eP6hUpETs1D4?p=preview

What is the expected behavior?

N/A

What is the motivation / use case for changing the behavior?

N/A

Please tell us about your environment:

  • Angular version: 2.0.0-rc.6
  • Browser: Chrome 52.0.2743.116 m
  • Language: TypeScript 1.8.6

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:2
  • Comments:11 (3 by maintainers)

github_iconTop GitHub Comments

3reactions
aipirvucommented, Jul 7, 2017

In my case it was because I wasn’t importing the routing module (where the paths were defined) to my feature module.

2reactions
jasedwardscommented, Sep 11, 2016

I fixed it by adding routing to my ChildModule. for example a route {path:‘’,component:ChildComponent}

Also you will want to get rid of the reference to ChildComponent in app.ts

Read more comments on GitHub >

github_iconTop Results From Across the Web

Maximum call stack size exceeded Lazy routing Angular 2
By assigning a value to loadChildren property inside a route, you have to reference a module, which has a routing system implemented.
Read more >
Routing Cause Maximum Call Stack Size Exceeded - ADocLib
Maximum call stack size exceeded error This error is almost always means you have a problem with recursion in JavaScript code as there...
Read more >
angular/angular - Gitter
CasesComponent class CasesComponent - inline template:0:7 caused by: Maximum call stack size exceeded. im totally new to angular.
Read more >
"Maximum call stack size exceeded" - endless instantiation of ...
I get the "Maximum call stack size exceeded" error because of this part ... implements HttpInterceptor { constructor(private router: Router, ...
Read more >
How to fix npm maximum call stack size exceeded error
The detail of the error may vary inside your npm-debug.log file, but this error is commonly caused by npm unable to complete a...
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