Topic: Preselect multiple Values in mdb-select
Hello,
I'm trying to preselect some values in my mdb-select, but it does'nt work. Here is my code :
HTML :
<mdb-select [options]="genresSelectList" [multiple]="true" placeholder="Genres" (selected)="genreSelected($event)" (deselected)="genreDeselected($event)"></mdb-select>TS :
export class MyComponent implements OnInit {
genresSelectList = [];
ngOnInit() {
this._plantService.findById(val)
.subscribe((plant: Plant) => {
plant.genres.forEach((genre: any) => {
this.genresSelectList = [...this.genresSelectList, {value:genre.id, label:genre.name, selected:true}];
});
})
;
}
}
I cannot use ngModel because i'm using reactive form.
Thank you for your help.
Add comment
Hello,
Here is an example:
HTML:
TS:
Regards,
Arek
<form [formGroup]="testForm"> <divclass="row"> <divclass="col-md-6"> <mdb-select [multiple]="true" [options]="optionsSelect"formControlName="testSelect"placeholder="Choose your option"></mdb-select> <label>Example label</label> </div> </div> </form>
optionsSelect= [
{ value: '1', label: 'Option 1' },
{ value: '2', label: 'Option 2' },
{ value: '3', label: 'Option 3' },
];
testForm: FormGroup;
ngOnInit() {
this.testForm=newFormGroup({
testSelect:newFormControl('')
});
this.testForm.controls.testSelect.setValue(['1', '2']);
}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Resolved
Specification of the issue
- ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: 6.2.3
- Device: Macbook Pro
- Browser: Chrome
- OS: 10.13.6
- Provided sample code: Yes
- Provided link: No