Angular 4 setting selected option in Dropdown
If you want to select a value as default, in your form builder give it a value :
this.myForm = this.FB.group({
mySelect: [this.options[0].key, [/* Validators here */]]
});
Now in your HTML :
<form [formGroup]="myForm">
<select [formControlName]="mySelect">
<option *ngFor="let opt of options" [value]="opt.key">ANY TEXT YOU WANT HERE</option>
</select>
</form>
What my code does is giving your select a value, that is equal to the first value of your options list. This is how you select an option as default in Angular, selected is useless.
If you want to select a value based on true / false use
[selected]="opt.selected == true"
<option *ngFor="let opt of question.options" [value]="opt.key" [selected]="opt.selected == true">{{opt.selected+opt.value}}</option>
checkit out
Angular 2 - Setting selected value on dropdown list
Here is my example:
<div class="form-group">
<label for="contactMethod">Contact method</label>
<select
name="contactMethod"
id="contactMethod"
class="form-control"
[(ngModel)]="contact.contactMethod">
<option *ngFor="let method of contactMethods" [value]="method.id">{{ method.label }}</option>
</select>
</div>
And in component you must get values from select:
contactMethods = [
{ id: 1, label: "Email" },
{ id: 2, label: "Phone" }
]
So, if you want select to have a default value selected (and proabbly you want that):
contact = {
firstName: "CFR",
comment: "No comment",
subscribe: true,
contactMethod: 2 // this id you'll send and get from backend
}