Angular2 EventEmitter fire to parent component

问题:

I am trying to fire an Event from the child component to the parent component.

 @Component({  template:'<foo></foo>' })  export class ParentComponent{    onDoSomething($event){    //do work here    }  }  @Component({ selector:'foo' template:<button (click)="onClick($event)">MyButton</button> }) export class ChildComponent{    myEvent eventName = new EventEmitter();     onClick(button){         this.eventName.emit(button);    }   }

How do i get this to work?

回答1:

You define an EventEmitter in your child component with @Output

@Component({  selector:'foo',  template:`<button (click)="onClick($event)">MyButton</button>` }) export class ChildComponent{    @Output() myEvent = new EventEmitter();     onClick(button){         this.myEvent.emit(button);    }   }

then you "subscribe" to this event in your parent component like this:

@Component({   selector: 'my-app',   template: `Hello World <foo (myEvent)="myEvent($event)"></foo>`,   directives: [],   providers: [] }) export class AppComponent {      myEvent($event){       console.log(1, $event);     } }

Full example: http://plnkr.co/edit/MeQbC7Jbc8rprMF66aEF?p=preview

转载请标明出处:Angular2 EventEmitter fire to parent component

文章来源: Angular2 EventEmitter fire to parent component