Angular reactive form, multiple select option not showing first 'selected disabled' option

Question

I am trying to get my field to work properly on angular 6 reactive form,

The problem is that the first option (the selected disabled option) is not showing as first on initiating (it shows the one from option from the *ngFor's) , I think that the main issue caused from the multiple select option attribute, even thou it not initiating as a multiple select option but as a simple select option (It changes by different input to multiple select option)

here's my code:

  <div class="form-group">
    <label for="cakes" class="sr-only">Select from existing</label>
    <select  formControlName="cakes" name="cakes" [multiple]="form.value.amount > 1" class="form-control">
      <option  value="null" disabled selected>Select {{form.value.amount}}</option>
      <option *ngFor="let cake of cakes" [value]="cake.id">{{cake.name}}</option>
    </select>
  </div>

try out : stackoverflow.com/questions/5805059/…

Pranay Rana
– Pranay Rana

2018-05-03 07:05:59 +00:00
Commented May 3, 2018 at 7:05 — Pranay Rana
– Pranay Rana, Commented May 3, 2018 at 7:05

Sasan N · Accepted Answer · 2018-08-15 21:51:36Z

1

please set default value of first select option as a "".

like below

<option value="">--- Select ---</option>

answered Aug 15, 2018 at 21:51

Sasan N

9713 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular reactive form, multiple select option not showing first 'selected disabled' option

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related