Угловая реактивная форма, опция множественного выбора, не показывающая первую опцию «выбрано отключено»

Question

Я пытаюсь заставить свое поле работать должным образом на угловой 6 реактивной форме,

Проблема в том, что первый параметр (выбранный отключенный параметр) не отображается как первый при инициализации (он показывает вариант из параметра *ngFor), я думаю, что основной проблема, вызванная атрибутом множественного выбора, даже если она не инициируется как опция выбора множественный , а как опция простого выбора (она изменяется при различном вводе для опции множественного выбора)

вот мой код:

  <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>

Answer 1

установите значение по умолчанию для первого параметра выбора как "".

как показано ниже

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