How to pass parameters to a typescript function from html?

Question

I am fetching my users in the form of a JSONArray and I want to show the data of each user when clicked on their names. but I am not able to pass the user.id into the function.

<ng-container *ngFor = "let user of users" >
        <button (onclick)="getdata(user.id)" mat-raised-button color="primary">{{user.name}}</button>
      </ng-container>

Answer 1

Its angular use (click) instead of (onclick)

<ng-container *ngFor="let user of users">
  <button (click)="getdata(user.id)" mat-raised-button color="primary">
    {{ user.name }}
  </button>
</ng-container>

getdata(id) {
  console.log(id);
}

Answer 2

Can you please try the same with using only click() instead on onclick()

<ng-container *ngFor = "let user of users" >
    <button (click)="getdata(user.id)" mat-raised-button color="primary">{{user.name}}</button>
  </ng-container>

Answer 3

try this

<ng-container *ngFor = "let user of users" >
    <button (click)="getdata(user.id)" mat-raised-button color="primary">{{user.name}}</button>
</ng-container>