how to use select option in angular reactive form

Question

I have a form where i am getting dynamic list of items in drop down. When i am selecting one of the item from list, on onchange function i am getting some garbage value.

component.html

         <div class="form-group row">
        <label class="col-sm-2 col-form-label">Select item</label>
        <div class="col-sm-10 txt-box">
          <select
            type="number"
            class="form-control"
            formControlName="ItemId"
            (change)="onChangeItem($event.target.value)"
          >
            <option hiddenvalue="" disabled="true"
              >Please select item</option
            >
            <option
              *ngFor="let list of itemArray"
              type="number"
              [ngValue]="list.Id"
            >
              {{ list.Name }}
            </option>
          </select>
        
        </div>
      </div>

When i select one of the item from list i found that some garbage value is being added. For example if i select an item of id "2" then on console i am getting "2: 2" kind of value. I don't know why it is happening??

component.ts code

     onChangeItem(value){
    console.log(value)
     }

question from:https://stackoverflow.com/questions/65883002/how-to-use-select-option-in-angular-reactive-form

Answer 1

Waitting for answers