Erik Ostermueller
Erik Ostermueller

Reputation: 508

Angular 'is not a function' caused by missing import?

Getting an 'is not a function' in Angular 7 / typescript 3-ish, using an EventEmitter. Much has been written (a b) about this error, but very few upvotes for answers (a b c d e f ). I'm almost there, but need some help finishing this off.

Here is one stackblitz with the error. ...and a similar one without the error.

The only difference seems to be that with the error, my event emitter and receiver are in sibling folders. In the one that works, the event receiver is in a parent folder and the emitter is in a child folder.

It seems like some kind of an import/module tweak is required to fix the broken one, but I can't seem to get it. Suggestions?

enter image description here

Upvotes: 0

Views: 735

Answers (2)

Muhammad Kamran
Muhammad Kamran

Reputation: 1027

In your parent ts. You have a function:

parentListner($event) {
    this.childMessage = $event
 }

While in html you are calling:

<app-child (childEvent)="parentListener($event)"></app-child>

Names have to be the same.

Upvotes: 2

Julian W.
Julian W.

Reputation: 1571

There is a typo in your parent.component.ts file. You named function as parentListner in ts file but used parentListener in html file.

Upvotes: 2

Related Questions