Блог

Главная - Вопросы по программированию - Как передать идентификатор моему запросу API из выбранного выпадающего списка в Angular 6?

Как передать идентификатор моему запросу API из выбранного выпадающего списка в Angular 6?

#javascript #angular #angular6 #angular8

#javascript #angular #angular6 #angular8

Вопрос:

Я использую Angular 6 здесь, у меня есть один выпадающий список, который поступает из ответа API.

 <select 
  class="form-control" 
  name="empName" 
  [(ngModel)]="allData.secondEmp" 
  (change)="typeChange()" 
  (blur)="getid($event)" 
  required
>                           
  <option 
    *ngFor="let employee of Employees" 
    value="{{employee.secondEmp}}">{{employee.firstName}}</option>
</select>

Здесь у меня есть массив, подобный

 employees = [{id: 1, firstEMp: 'kaushik', secondEmp: 'krishna'}....]

Здесь я хочу получить идентификатор в своем запросе при изменении функции выпадающего списка.

Я знаю, что нам нужно изменить, value="{{employee.id}}" но у меня здесь есть некоторые другие *ngIf условия, поэтому я не могу изменить value здесь. Любое другое решение для этого? TIA

Ответ №1:

 [ngValue] = "{secondEmployee: employee.secondEmp , id: employee.id }"

попробуйте это

Комментарии:

1. Это выдает мне некоторую ошибку, например, не удается прочитать свойство ‘secondEmployee’ из undefined

2. Есть альтернативное решение для этого?

Ответ №2:

В вашем файле шаблона: используйте атрибут данных

  <select 
  class="form-control" 
  name="empName" 
  [(ngModel)]="allData.secondEmp" 
  (change)="typeChange()" 
  (blur)="getid($event)" 
  required>                           
  <option 
    *ngFor="let employee of Employees" 
    value="{{employee.secondEmp}}"
    [attr.data-empid] = "employee.id">{{employee.firstName}}</option>
</select>

В файле TS: получите свой идентификатор

 getid(e) {
    const targetIndex = e.target;
    const res = targetIndex.options[targetIndex.selectedIndex].dataset.empid;
    console.log(res);
  }