1 Вопрос: Как установить значение по умолчанию при использовании Object.keys в цикле ngFor?

вопрос создан в Thu, May 2, 2019 12:00 AM
<mat-select required formControlName="country" [(ngModel)]="defaultCountry" placeholder="Country">
   <mat-option *ngFor="let key of Object.keys(countryList)" [value]="[key]">{{[key]}}</mat-option>
</mat-select>

У меня есть вышеуказанный код. Страны хорошо отображаются в окне выбора материала, но опция по умолчанию «DefaultCountry» не работает. Я считаю, что это из-за того, что я использую Object.keys, потому что следующий код работает с опцией по умолчанию.

<mat-select required formControlName="country" [(ngModel)]="defaultCountry" placeholder="Country">
   <mat-option *ngFor="let country of deleteLaterCountryList" [value]="country.countryCode">{{country.countryCode}}</mat-option>
</mat-select>

Я хочу знать, как заставить мой первый фрагмент кода работать, используя опцию по умолчанию. Я не хочу использовать второй кусок кода.

    
0
  1. Пожалуйста, предоставьте больше кода & контекст к нему. Мы даже не знаем структуру вашего списка. Попробуйте предоставить минимальный, полный и проверяемый пример .
    2019-05-02 14: 50: 23Z
1 ответ                              1                         

Мне действительно нужно больше подробностей, но я вижу, что вы используете Реактивную форму. В этом случае нет необходимости в ngModel. Предположим, что вы используете formGroup с именем yourForm.

<form [formGroup]="yourForm">
  .
  .
  <mat-select required formControlName="country" placeholder="Country">
    <mat-option *ngFor="let key of Object.keys(countryList)" [value]="[key]">{{[key]}}</mat-option>
  </mat-select>
  .
  .
<form>

В component.ts вы можете использовать patchValue, чтобы присвоить значение country formControl, который будет отображаться как опция по умолчанию.

yourForm: FormGroup = this.formBuilder.group({
  country: [null, Validators.required],
  .
  .
  // other form controls
});

ngOnInit() {
  this.yourForm.patchValue({
    country: 'SG'
  });
}
    
1
2019-05-02 14: 59: 49Z
источник размещен Вот