How to catch a custom DOM event in Angular2?

Question

Angular

After the ngAfterViewInit event, I insert code into the DOM using jqvery.

$(this.elementRef.nativeElement).html('<div> <button id="foo" type="button" name="button">fire event</button> <script> $("#foo").on("click", function() { $(document).trigger("lorem"); }); </script> </div>');

add an event handler

$(document).on("lorem", function(event, param1, param2) { alert(param1 + param2); });

and there is a great desire to catch this event ("lorem"). But the trigger through the button (button id="foo") does not lead to anything.
It doesn't matter what to catch. Tried everything I could find. If you send an event through native javascript, then the trigger works. But the string with tags comes from the server. I cannot change it. The event is visible in Zone.js and is called HTML:document:lorem( something like that).
tell me where you can dig?

Answer 1

a bug in the angular cli or in the latest build of angular.
works on planker.
https://plnkr.co/edit/9nUO2TokGlJ6RvYYt1Sp?p=preview