Angular 4:How to Get Index of Selected Value in a Datalist

Select an option from a datalist and compare index number to another option in a second datalist

If both arrays will have the corresponding values in the same indecies, you can just do this in your onchange events for each drop down:

Side note datalist is not supported in Safari or IE Version <= 9, may want to change to a select element:

<select id="courses" onchange="UpdateFromCourses()">

</select>

//Just make another function like this doing 
//the same thing but to the other drop down

 function UpdateFromCourses(){
    const selIndex = document.getElementById('courses').selectedIndex;
    document.getElementById('catalogs').selectedIndex = selIndex;
 }

Setting Selected Value for DropDown List in ngFor Anular 5

No need to bind with ngModel if you are using selected, code your should be like this

<div class="section">
  <h6 style="font-weight:bold">Select a Branch</h6>
  <select >
      <option *ngFor="let item of this.dataList;let i = index" value="{{item.code}}" [selected]="i == 2">
        {{item.name}}
      </option>
    </select>
</div>

Working Example

---

Related Topics