Identify the p-checkbox where an event occurs in Angular

Question

I would like to know if there is a way to identify my checkbox, along with the event that occurs when it is selected, that is, if I can put a type of ID and pass it to my .ts file, along with the true or false that responds to me the event.

<p-checkbox name="reviewed" inputId="reviewed" [(ngModel)]="data.reviewed"
  [binary]="true" (onChange)="checkValue(data.reviewed)">
</p-checkbox>

checkValue(event: any){
    //here I want to recerive the checkbox ID;
    console.log(event);
}

So you should pass the `$event` into the method, not `data.reviewed` — Taplar, Dec 09 '20 at 19:45
I need the data.reviewed for other functionalities that I am doing, I would like to know if I can pass more than one value in the onChange — Beimar Rojas, Dec 09 '20 at 19:53
you can get the event object like this `(onChange)="checkValue($event)`you will get the checked value and original mouse event but my answer show an easy way to do it — Muhammed Albarmavi, Dec 10 '20 at 11:21
Thanks for the answers, I finally decided to change a few things in the rest of the code and decided to do it by passing only the $event. — Beimar Rojas, Dec 10 '20 at 16:24

score 4 · Accepted Answer · answered Dec 10 '20 at 09:21

you can create a template variable for the checkbox component then pass the inputId

<p-checkbox name="reviewed" inputId="reviewed" [(ngModel)]="data.reviewed"
  [binary]="true" (onChange)="checkValue(checkElm.inputId ,data.reviewed)" #checkElm>
</p-checkbox>

component.ts

checkValue(id,event: any){
  //here I want to recerive the checkbox ID;
}

if you want you can just pass the id as hardcoded value

<p-checkbox name="reviewed" inputId="reviewed" [(ngModel)]="data.reviewed"
  [binary]="true" (onChange)="checkValue('reviewed',data.reviewed)" >
</p-checkbox>

Thanks, with your first option it worked for me! – Beimar Rojas Dec 10 '20 at 16:26 — Beimar Rojas, Dec 10 '20 at 16:26

Identify the p-checkbox where an event occurs in Angular

1 Answers1