s

Home > angular > angular 2 how to pass the current element to a function

angular 2 how to pass the current element to a function edit button Edit

author
Murugan Andezuthu Dharmaratnam | calendar 21 February 2021 | 2038

In my angular application, I wanted to check if the SKU already exists on the server, If it exists display "SKU Already Exist". For this, I wanted to pass the current element and label element to the typescript function. I tried SKUExistVariant(this) but it did not work. The solution is the use the template reference variable. Below is the code on how I was able to pass both elements to the typescript function.

Solution 

<tr *ngFor="let item of variant; let rowIndex = index">
	<td>{{item.Name}}</td>
        <td>
		<input type="text" #skuvar  (change)="SKUExistVariant(skuvar,skuvarexist)"  [(ngModel)]="item.SKU" />
        	<label [hidden]="true" #skuvarexist style="color:red">SKU Already Exist</label>	
	</td>
</tr>


public SKUExistVariant(skuinput, skulabel) 
{
    console.log($(skuinput).val());
}