Как отправить значение параметра * ngFor, выбранного в реактивных формах

#angular

#angular

Вопрос:

У меня есть форма в Angular, опция выбора содержит данные, поступающие из веб-api. Что я хочу знать, так это как присвоить выбранное значение значению формы при отправке на данный момент это просто [object object]. Оператор ngFor является:

 <select class="form-select" formControlName="u_address" placeholder="Enter address">
   <option value="" disabled selected>Select your option</option>
   <option *ngFor="let item of customerAddress" [value]="item">
   {{item.address}}
   </option>
</select>
  

Затем в файле component.ts это:

   u_address: new FormControl(this.customerAddress),
  

Есть идеи?

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

1. Не могли бы вы поделиться своим объектом CustomerAddress?

Ответ №1:

Пожалуйста, используйте ngValue вместо value.

 <select class="form-select" formControlName="u_address" placeholder="Enter address">
   <option value="" disabled selected>Select your option</option>
   <option *ngFor="let item of customerAddress" [ngValue]="item">
   {{item.address}}
   </option>
</select>
  

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

1. вы можете использовать [значение], если вам не нужен объект (Шохель написал [значение]=»item.adress»). Если вам нужен весь объект, это правда, что вы должны использовать [ngValue]=»item»

2. Спасибо, нужный объект и не знал об этом исправлении

Ответ №2:

Просто попробуйте следующий код

 [value]="item.address"

<select class="form-select" formControlName="u_address" placeholder="Enter address">
   <option value="" disabled selected>Select your option</option>
   <option *ngFor="let item of customerAddress" [value]="item.address">
   {{item.address}}
   </option>
</select>