Is there a way to compile a component defined by a string and have it render in a template while still being able to bind the click event handler?
I attempted to use DomSanitizer:
this.sanitizer.bypassSecurityTrustHtml(parsedLinksString);
However, this approach did not properly bind the click event handler onButtonClick().
What I'm Trying To Achieve
@Component({
selector: 'app-sample-component',
templateUrl: './sample-component.component.html',
styleUrls: ['./sample-component.component.scss']
})
export class SampleComponent {
buildMessage() {
// How can I parse this string and render it so that it responds to events?
const myOutput = '<button (click)="onButtonClick()';
}
onButtonClick() {
console.log('Handler for Dynamic Button');
}
}