Add button dynamically in html

Hello, I’m adding buttons like this, but I can’t get the event

public addBtn(){
var html=’<ion-button expand=“block” (click)=“test()”>Ingresar 1’;

Assuming you’re using Angular, a much more idiomatic way of doing this is to modify a backing array in the controller and using the ngFor structural directive in the template. The technique is described in detail in part 2 of the Tour of Heroes. I would recommend making an effort to minimize all jQuery usage as much as possible.

Thanks, I understand using ngFor but I get the data from an AJAX so I don’t know how to pass this new HTML to the current one to be able to refresh everything and get events from these new generated buttons

  1. Please dont use any query selector in NG world.
  2. You can use <div [innerHTML]="htmlStr"></div> to display HTML code.
    But not all html tag can be use.

Thanks, I learned to use the innerHTML, but it doesn’t let me load buttons with link (click) = ‘inside (2)’ or with routerLink="/ login" and I just need to load this, how can it be done?

Ionic apps typically send and receive information from the internet. JSON is a great format for doing that. My personal opinion is that HTML is a terrible one, so if you don’t get any better answers, I would rearchitect the communication protocol to eliminate all passing of HTML from server to client, replacing it with equivalent information packaged in JSON or some other domain-specific language built atop JSON.

I have a simple HTML document that includes a button named click me how to add an event listener to a dynamically added element!

In the end I solved it with an array in the .ts and in the html use the ngFor, thanks

<ion-list padding>
     <ion-item *ngFor='let item of array_clinicos' color='primary' (click)="interior(">
             <ion-icon slot='start' name='arrow-round-forward'></ion-icon>