установить значение для выбранной по умолчанию опции в ионном 4

Question

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

Форма

<ion-item no-padding>
    <ion-label position="floating">Category</ion-label>
    <ion-select interface="action-sheet" [formControl]="formObj.controls['item_category']" >
    <ion-select-option *ngFor="let category of categories" value="{{category.c_id}}">{{category.c_title}}</ion-select-option>
    </ion-select>            
</ion-item>  

.ts

categories : any = [{"c_id":1,"c_title":"Phone"},
                    {"c_id":2,"c_title":"jewelry"}];


constructor(private formBuilder: FormBuilder){  
    this.formObj = formBuilder.group({  
        item_category: ['', Validators.compose([Validators.required])]
    }); 

    this.formObj.patchValue({
        item_category: 2,
    });         
}   

Answer 1

html

<ion-content>
  <form [formGroup]="myform">
    <ion-item no-padding>
      <ion-label position="floating">Category</ion-label>
      <ion-select interface="action-sheet" formControlName="item_category">
        <ion-select-option *ngFor="let category of categories" value="{{category.c_id}}">{{category.c_title}}</ion-select-option>
      </ion-select>            
    </ion-item>
  </form>
  {{myform.value | json}}
</ion-content>

ts

export class HomePage {
  myform;
  categories = [
    {
      c_id: 1,
      c_title: 'Category 1'
    }, {
      c_id: 2,
      c_title: 'Category 2'
    }
  ];
  constructor(public loadingCtrl: LoadingController) {
    this.myform = new FormGroup({
      item_category: new FormControl()
    });

    this.myform.patchValue({
      item_category: '2',
    });
  }
}

Answer 2

Просто используйте [(ngModel)], чтобы связать свойство фактического значения с ion-select.

<ion-select interface="action-sheet" [(ngModel)]="selectedCategoryId" >
      <ion-select-option *ngFor="let category of categories" value="{{category.c_id}}">{{category.c_title}}</ion-select-option>
</ion-select>

ExampleComponent.ts

export class ExampleComponent {

  selectedCategoryId= 11;

}