CODEWITHSUNDEEP
javascriptangulartypescript
billy_comic
billy_comic

Reputation: 899

How To Pass Object From *ngFor Select Options To (change) function Angular 2

I have a *ngFor select option list that I am using to pass options to functions. I cannot figure out how to pass the actual object (not value) through to the function I'm calling.

<h1>
  {{title}}
  <form name="qrForm">
   <h2>Item Number</h2>
   <input type="number" name="myitem" [(ngModel)]="itemno"
(blur)="getItemsList(scriptno)">
  <h2>Date of birth</h2>
  <input type="date" name="dob" [(ngModel)]="dateofbirth" (blur)="getItemsList(itemno, dateofbirth)">
  <div *ngIf="showDeliveryTypes" name="deliverytypes">
  <h3>Delivery Method</h3>
  <select #select [(ngModel)]="current" (change)="validateDeliveryTypes(select.value)" name="deliveryoptions">
    <option *ngFor="let item of qrData.DeliveryTypes" [value]="item.DeliveryTypeId">{{item.DeliveryTypeName}}</option>

  </select>
  </div>
 </form>
</h1>

In the (change)="validateDeliveryTypes()" function I'm getting the item.DeliveryTypeId value (which is what you would expect). But, how can I get the "item" object so I can access all the properties on that object and not just the DeliveryTypeId?

Any help greatly appreciated. Still learning Angular 2.

Upvotes: 2

Views: 2485

Answers (1)

ajai Jothi
ajai Jothi

Reputation: 2294

You can find it by the selected DeliveryTypeId inside validateDeliveryTypes method using Array.prototype.find

...
public validateDeliveryTypes(){
   let selectedItem = this.qrData.DeliveryTypes.find((item)=> item.DeliveryTypeId===this.current);
   //rest of your code here
}
...

Upvotes: 2

Related Questions