Select default value in select dropdown with Angular 6

Question

I would like to select default value ( 484 which is Mexico), but the first item get selected.

In the text, I print all value, and they are all OK (country.id === tournament.venue.country_id condition is working)

Here is my code, I am not using reactive forms:

<select class="form-control select-lg" id="country_id" name="country_id" [(ngModel)]="tournament.venue.country_id">
    <option *ngFor="let country of countries"
        [selected]="country.id === tournament.venue.country_id"
        [ngValue]="tournament.venue.country_id">
        {{ country.name }} {{ country.id }} {{ country.id === tournament.venue.country_id }}
    </option>
</select>

What am I doing wrong ?

Sachila Ranawaka · Accepted Answer · 2018-06-25 11:57:39Z

3

ngValue should be country id

 [ngValue]="country.id">

answered Jun 25, 2018 at 11:57

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

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

1 Comment

Juliatzin Over a year ago

ooooo ! Thanks !

Collectives™ on Stack Overflow

Select default value in select dropdown with Angular 6

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related