How to change formio form select component value in angular

Question

I have one submit from in formio which contains city dropdown and other fields. And I need to set value to city dropdown in angular component while loading the form.

While loading the above form, I want to assign the city drop down value in angular component.

Any suggestions will help me.

<formio src="{{config.appUrl}}/esdtest"></formio>

I have accessed dropdown but am not able to set value :

ngAfterViewInit():void {  
  Formio.accessInfo().then(success => {
    var ddlcity = <HTMLSelectElement>document.getElementsByName("data[city]")[0];
    ddlcity.value="Hyderabad";
  })
}

ddlcity.value="Hyderabad"; is not setting value to dropdown.

Answer 1

Can you try this :

ngAfterViewInit():void {
  Formio.accessInfo().then(success => {
    var ddlcity = <HTMLSelectElement>document.getElementsByName("data[city]")[0];
    for(let i=0; i<ddlcity.options.length; i++){
      if(ddlcity.options[i].value === 'Hyderabad'){
        ddlcity.selectedIndex = i;
        break;
      }
    }
  });
}