javascript - ERROR TypeError: Cannot read property 'ngInjectableDef' of undefined - Stack Overflow

admin管理员组

文章数量:1221774

I have an abstract class below :

import { Inject } from '@angular/core';
import { TestService } from '../test-service';

export abstract class DummyAbstract {

    constructor (
        private testService: TestService
    ) {

    }

    abstract thisisimp();
}

I have a child a class as below :

import { Injectable } from '@angular/core';
import { DummyAbstract } from './dummy-abstract';

@Injectable({
    providedIn: 'root'
})
export class ThisChild extends DummyAbstract {
    thisisimp() {
        return 'text';
    }
}

The problem comes when I try to load the child class in some other service

import { Injectable } from '@angular/core';
import { ThisChild } from './this-child';

@Injectable({
    providedIn: 'root'
})
export class SomeOtherService {    
    constructor(private thisChild: ThisChild) {

    }
}

It throws the following error

ERROR TypeError: Cannot read property 'ngInjectableDef' of undefined at resolveNgModuleDep (core.js:8353) at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9057) at inject (core.js:1403) at injectArgs (core.js:1437) at core.js:1491 at _callFactory (core.js:8431) at createProviderInstance (core.js:8389) at resolveNgModuleDep (core.js:8364) at NgModuleRef.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9057) at inject (core.js:1403)

I have an abstract class below :

import { Inject } from '@angular/core';
import { TestService } from '../test-service';

export abstract class DummyAbstract {

    constructor (
        private testService: TestService
    ) {

    }

    abstract thisisimp();
}

I have a child a class as below :

import { Injectable } from '@angular/core';
import { DummyAbstract } from './dummy-abstract';

@Injectable({
    providedIn: 'root'
})
export class ThisChild extends DummyAbstract {
    thisisimp() {
        return 'text';
    }
}

The problem comes when I try to load the child class in some other service

import { Injectable } from '@angular/core';
import { ThisChild } from './this-child';

@Injectable({
    providedIn: 'root'
})
export class SomeOtherService {    
    constructor(private thisChild: ThisChild) {

    }
}

It throws the following error

ERROR TypeError: Cannot read property 'ngInjectableDef' of undefined at resolveNgModuleDep (core.js:8353) at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9057) at inject (core.js:1403) at injectArgs (core.js:1437) at core.js:1491 at _callFactory (core.js:8431) at createProviderInstance (core.js:8389) at resolveNgModuleDep (core.js:8364) at NgModuleRef.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9057) at inject (core.js:1403)

• javascript
• angular

Share Improve this question Follow asked Nov 7, 2018 at 13:51 AbuHuraira LakdawalaAbuHuraira Lakdawala 78611 gold badge99 silver badges2525 bronze badges

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 10

Angular Dependency Injection system only extracts/resolves dependency for a class on which Injectable decorator is written. You've to handle other stuff by your own.

DummyAbstract constructor has constructor with TestService dependency, and when you extend using ThisChild provider, you haven't had passed TestService to the constructor of an DummyAbstract. Whenever you have such case you have to pass dependencies explicitly to the parent class using super method to call base class constructor.

export class ThisChild extends DummyAbstract {
    constructor(testService: TestService) { // no private or public
       super(testService); //calling base class constructor with dependency.
    }
    thisisimp() {
        return 'text';
    }
}

Since there is not much google search result for this problem I will provide my solution for it here (not related to this particular problem but with same error message). So basically i get this problem as well: ERROR TypeError: Cannot read property 'ngInjectableDef' of undefined Nothing has been changed in a code before and after the error start to appears. All i had to do was remove node_module folder, flush node cache and reinstall it and it started to work. It was related to some angular material changes as far as I know.

Don't use mock class object inside mockClassName = TestBed(mockClassName): Use real imported class object instead like below mockClassName = TestBed(ClassName):

本文标签： javascriptERROR TypeError Cannot read property 39ngInjectableDef39 of undefinedStack Overflow