Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular: Cannot read property 'call' of undefined (when bootstrapping)

Tags:

Check the update on the bottom!

I have a service that throws an error while the app is bootstrapping. Cannot read property 'call' of undefined. I'm using ng2 2.4.2 and angular-cli 1.0.0-beta.24.

ERROR

Uncaught TypeError: Cannot read property 'call' of undefined at webpack_require (bootstrap 81b10f8…:52) at Object.621 (environment.ts:8) at webpack_require (bootstrap 81b10f8…:52) at Object.450 (src async:7) at webpack_require (bootstrap 81b10f8…:52) at Object.1057 (util.service.ts:35) at webpack_require (bootstrap 81b10f8…:52) at webpackJsonpCallback (bootstrap 81b10f8…:23) at main.bundle.js:1

As you can see it's a problem with the util service - this looks as follows:

import { Injectable } from '@angular/core'; import { Router } from '@angular/router'; import { Project } from '../datatypes/'; import { Response } from '@angular/http';   @Injectable() export class UtilService {     constructor(private router: Router) {}      public redirectToProject(project: Project) {         let query = project.ProjectName.split(' ')             .join('-')             .concat('-' + project.Id)             .toLowerCase();         this.router.navigate(['/project', query]);     }      public extractData(res: Response) {         let body = res.json();         return body || {};     } } 

Strange: When inspecting the source file in chrome it has no syntax highlighting, which would suggest a syntax error - in my opinion there's none though.

Update January 20. 2017

I updated to ng2.4.4 and angular-cli 1.0.0-beta26. The problem is still the same. While playing around, Arjan found out that it works with beta 21. Will have to check the changes. The problem now isn't in the service above but in the environment.ts file (which has all the defaults).

like image 428
sandrooco Avatar asked Jan 09 '17 14:01

sandrooco


1 Answers

I think it happens when you make changes to module imports during run time.

Run the application again using ng serve and it fixed the issue for me.

It may also occur when you try to use components of lazy loaded modules in other modules before the lazy module getting loaded or such similar scenarios.

like image 195
Franklin Pious Avatar answered Sep 20 '22 15:09

Franklin Pious