In Angular can I use @Input as event emitter

Question

I like to explore the feasibility with using component Input as Event output, similar to how react does it.

Parent component

parentHandler(message){
   console.log(message)
}

Parent html

<child [myEvent]="parentHanlder"></child>

Child component

@Input myEvent

ngOnInit(){

this.myEvent('hello')

}

I am wondering if there are disadvantage or potential issue with this approach eg memory/performance

thank you

Answer 1

You can use setter in this situation

Parent:

<child [myEvent]="parentHanlder"></child>

Child (ts):

@Input()
set myEvent(parentHandler: string) {
     this.myEvent('hello');
}

Answer 2

This will work perfectly as expected.

The behavior will be similar to @Output except the context of execution.

The scope of execution will be with child component

export class AppComponent {
 version: number = 7;
  messageMe(param){
    alert("Message Me.."+param+this.version); 
  }
}

<framework
[messageHandler]="messageMe"></framework>


export class FrameworkComponent implements OnInit {
  @Input()
  messageHandler: Function;

  name="Jone";

  ngOnInit() {
    this.messageHandler(this.name);
  }
}