Consider the following code:
<form[formGroup]="form">
<ejs-dropdownlist
#dropdownlist
placeholder="{{ placeholder }}"
[dataSource]="datasource"
[cssClass]="'e-outline'"
[fields]="fields"
[formControlName]="controlName"
[showClearButton]="true"
[allowFiltering]="true"
>
<ng-template#itemTemplatelet-data>
<div>
<spanclass="code-container">{{ data.coa }}</span>{{ data.name }}
</div>
</ng-template>
<ng-template#valueTemplatelet-data>
<divclass="value-container long-text">
<spanclass="code-container">{{ data?.coa }}</span>{{ data?.name }}
</div>
</ng-template>
</ejs-dropdownlist>
</form>
// TS file
fields:Object={ text:"name",value:"id"};
form:FormGroup;
constructor(private fb:FormBuilder){}
ngOnInit():void{
this.placeholder ='Choose an account';
this.form =this.fb.group({
accountId:[1],// pre-select id 1
});
this.accountList =[
{id:1, name:'Account A', code:'100'},
{id:2, name:'Account B', code:'200'},
];
}
When I try to pre-select an account for the dropdownlist, it's not showing. Please assist.