-1

I'm on Angular, I created a form. And when I arrive on the page the select works but nothing is displayed. 

<select formControlName="breed" required>
    <option value="undefined" selected="true">{{ 'pet.choose_breed' | translate }}</option>
 </select>

The result is as follows:

enter image description here

I would like it to give this:

enter image description here

The problem probably comes from the value, I modified it several times but nothing works.

mathiasF
  • 267
  • 1
  • 4
  • 14
  • 2
    what is not working in this do you want to display a drop down based on the select of the previous select option – Rahul Singh Jan 12 '18 at 10:02
  • In fact I would just like that at the moment I arrive on the page that it is displayed "choisir une race" on the select. Sorry, I don't know if I'm clear enough :( – mathiasF Jan 12 '18 at 10:08

2 Answers2

1

You might want to look at [selected] attribute or [(ngModel)] to give a default value to your select dropdown.

This medium link might help you understand better https://medium.com/@phismonster/set-default-value-for-select-in-angular-2-27f0da413935

Rahul Singh
  • 19,030
  • 11
  • 64
  • 86
  • For those who have the same problem the first part of this article gives us the answer. It's all really silly. :) Thanks to @Rahul Singh – mathiasF Jan 12 '18 at 10:43
1

If i understand correctly you want a placeholder to be displayed on the select element.

<select placeholder="choisir une race" formControlName="breed" required>
    <option value="undefined" selected="true">{{ 'pet.choose_breed' | translate }}</option>
    <option [value]="breed.id" *ngFor="let breed of breeds">{{ breed.lib }}</option>
 </select>
Mjstk
  • 508
  • 4
  • 9
  • Yes, actually I want it to display a sentence by default when the user arrives on the page. – mathiasF Jan 12 '18 at 10:15
  • Is it working the code i gave you? i think you just need to add that placeholder="choisir une race" on the select element. – Mjstk Jan 12 '18 at 10:17
  • No, unfortunately it doesn't work. But under angular I have a lot of similar problems – mathiasF Jan 12 '18 at 10:21