Q:

Dynamically attach events to an Input

I am creating a form generator in ng5. Basically, I send it JSON and it generates the form.
I need a way to attach events dynamically to a FormControl. I am passing it the following JSON in:
{
  events: {
     click: 'functionNameHere',
     dblclick: 'functionNameHere',
     so on ....
  }
}

How do I attach any events passed here to my control?

A:

In ng5 the best way to attach listeners dynamically would be through the way of Renderer2. 
let simple = this.renderer.listen(yourElement, yourEvent, 
(evt) => {
  console.log(evt);
});

You can refer to the answer given by Eric Martinez dynamically adding listeners in angular
Best way would be to create a directive for your form elements like [handleEventInputs] and pass the events data to it.
Use the renderer to listen to the events of only those elements
using ElementRef.
Create an event emitter in your directive to send the event data along with the type of event back to your form generator component.
Your component:
<input type="text" [handleEventInputs]="events" (eventData)="myFunction($event)"/>

Your directive:
@Input('handleEventInputs') eventObject = {};
@Output() eventData = new EventEmitter<{type: string, event: Event}>();

this.renderer.listen(this.element.nativeElement, 'your-event', (event) => {
  this.eventData.emit({type: 'your-event', event});
});

