Range Error: Maximum call stack exceeded angular2 meteor (Solved)

help
1

Hello,

I’m trying to follow the angular-meteor tutorial for angular 2, and I’m troubled in getting the first part, i’m using Meteor 1.3.2.4, which is the latest release available for now, and by the time i try to load the first component with angular2, i get the following erro in the browser console, and it doesn’t load:
[Error] EXCEPTION: RangeError: Maximum call stack size exceeded.
logError (modules.js:77411)
logGroup (modules.js:77421)
call (modules.js:49539)
(função anônima) (modules.js:54983)
invoke (modules.js:45235)
onInvoke (modules.js:55404)
invoke (modules.js:45234)
run (modules.js:45128)
runInner (modules.js:55435)
run (modules.js:55327)
run (modules.js:54972)
coreLoadAndBootstrap (modules.js:54778)
bootstrap (modules.js:58606)
(função anônima) (app.js:26)
fileEvaluate (modules-runtime.js:158)
require (modules-runtime.js:92)
global code (app.js:31)

the code I’m using is the for the app.ts is the exact from the tutorial:
import ‘reflect-metadata’;
import ‘zone.js/dist/zone’;
import { Component } from ‘@angular/core’;
import { bootstrap } from ‘@angular/platform-browser-dynamic’;

@Component({
selector: ‘app’,
templateUrl: ‘app/client/app.html’
})
class Socially { }

bootstrap(Socially);

my file app.html is filled with:
Hello World!

and my index.html is:

all of the above files are in the client folder, the rest of the files are too, equal to the tutorial.
As i have seen i tried to change the templateUrl to template, and fill with the contents of the file app.html, then the app starts and all is well, but i wish to use the templateUrl in my components, since i separates the html from the script, which makes the app more readable. Anyone having the same issues, i need help, I’ve even tried to downgrade to meteor 1.3.1. and the same thing happens, so I’m asking for help pls…

2

Hello,

I found out that it works in the chrome, and microsoft edge, but it doesn’t works in safari, i’m using OS X El Capitan, with Safari 9.1.1. I think that it doesn’t support fully the es5, any hints to bypass this?

3

Hi @niltong09 you can track here.
Some other people also meet this problem.

1 Like
4

Hello @Hongbo_Miao, Thanks for the reply, I think I’ve missed that post.

For the people that don’t want to follow the link, the solution is to remove the import from zone.js, in the app.ts file, so the contents stay like this

import 'reflect-metadata';
import { Component } from '@angular/core';
import { bootstrap } from '@angular/platform-browser-dynamic';

@Component({
selector: 'app',
templateUrl: 'app/client/app.html'
})
class Socially { }

bootstrap(Socially);
5

You still need to use NgZone in the future.
So still need import 'zone.js/dist/zone'; some day.

The weird thing is for my app, I am using import 'zone.js/dist/zone';. And my Safari can work well too.

6

Strange thing,

but from the answer in the other post in my understanding, the NgZone doesn’t use the zone.js, isn’t that assumption correct?

7

NgZone is a forked zone with additional APIs based on Observables

And have a see for these two articles: