select2 angular2 + установка 1-го значения по умолчанию

Question

<select class="example-full-width js-example-basic-single" #country name="country" [(ngModel)]="companycountryValue" required>
  <option *ngFor="let country of countrydata" [value]="country.name">{{ country.value }}</option>
</select>

Как сделать первый вариант выбранным по умолчанию?[(ngModel)] = "companycountryValue" уже выбрал данные, слишком перепробовал много методов, ни один из которых не работает.

Answer 1

Существует 2 способа решения вашей проблемы

Шаг 1: // подбираем индекс опции и устанавливаем его в атрибутах html следующим образом:

    <select class="example-full-width js-example-basic-single" #country name="country" [(ngModel)]="companycountryValue" required>
  <option *ngFor="let country of countrydata; let i = index" [value]="country.name" [selected]="i == 0 ? true : null" >{{ country.value }}</option>
</select>

Шаг 2: настройка от компонента до выбора

ngOnit(){
          this.companycountryValue=countrydata[0];
}

, а в html вы можете установить как

<select class="example-full-width js-example-basic-single" #country name="country" [(ngModel)]="companycountryValue" required>
  <option *ngFor="let country of countrydata" [value]="country.name">{{ country.value }}</option>
</select>

Answer 2

В компоненте просто выполните

this.companycountryValue="some default country.name value"

, просто имейте в виду, что значение по умолчанию muest может быть назначено всему, что скрывается под country.name, поэтому опция с этим [value] станет выбранной

БОНУС: Разве вы не хотите это сделать?

 <option *ngFor="let country of countrydata" [value]="country.value">{{ country.name}}</option>