CODEWITHSUNDEEP
angularnativescript
Sudeep Mishra
Sudeep Mishra

Reputation: 63

How to use EventEmitter to pass function to a child component?

I have a parent-child component setup where on (tap) event on an element in child, i need to invoke a parent method. I am trying the eventEmmiter but am getting this error:

Error: com.tns.NativeScriptException: Failed to find module: "events", relative to: app/tns_modules/

Code snippet

Parent.component.html

<app-header (thisEvent)="navigate($event)"></app-header>

Parent.component.ts

import { Component } from "@angular/core";
@Component({
  moduleId: module.id,
  selector: "app-main",
  templateUrl: "./parent.component.html",
  styleUrls: ["./parent.component.css"]
})
export class ParentComponent {
naviagte(args){
this.router.navigate(["/"]);
}
}

Child.component.html:

<Button text="Tap" class="btn btn-primary" (tap)="onTap($event)"></label>

Child.component.ts:

import { Component, Input, Output } from "@angular/core";
import { EventEmitter } from "events";
@Component({
  selector: "app-header",
  moduleId: module.id,
  templateUrl: "./child.component.html",
  styleUrls: ["./child.component.css"]
})
export class ChildComponent {
  @Output()
  thisEvent= new EventEmitter();
  navigate(args) {
    this.thisEvent.emit(null);
  }
}

Upvotes: 1

Views: 1184

Answers (3)

mohammad aaqib
mohammad aaqib

Reputation: 1

import { EventEmitter } from "@angular/core";

EventEmitter from "@angular/core"

Upvotes: 0

Sri Vivek
Sri Vivek

Reputation: 535

Error you get is due to wrong import 

import { EventEmitter } from "events";

EventEmitter should be import from angular/core package

import { EventEmitter } from '@angular/core';

Upvotes: 0

SeleM
SeleM

Reputation: 9658

Should import EventEmitter from @angular/core not from events.

import { Component, Input, Output, EventEmitter } from "@angular/core";

Upvotes: 4

Related Questions