MDB-Select – Cannot use ngFor

MDB SupportCategory: MDB AngularMDB-Select – Cannot use ngFor
sdhakad Pro User asked 7 months ago in MDB pro, version:5

Is there any scope of using ngFor with mdb-select for the options.

I have a complex object array which has to be rendered in to the options.It would be a tds task to convert that object into the MDBSelectOptions class.

And assume that I have multiple select boxes in the form,it becomes very slow.

Secondly,how can we mark the selected value in the mdb-select while editing a pre-filled form.

1 Answers
Dawid Adach Pro User answered 7 months ago

Dear sdhakad,

material select wasn’t aimed to be used with ngFor, it’s recommended to prepare your data at backend side and pass it to material select options.

As per selecting an option you can use ngModel :

 

<div class="row">
<divclass="col-md-6">
<mdb-select [options]="dateOptionsSelect" [(ngModel)]="selectedCharacter">
placeholder="Choose your option"></mdb-select>
<label>Example label</label>
</div>
</div>

.ts: onInit:

dateOptionsSelect = [

{ value: '1', label: 'Today', selected: true },

{ value: '2', label: 'Yesterday' },

{ value: '3', label: 'Last 7 days' },

{ value: '4', label: 'Last 30 days' },

{ value: '5', label: 'Last week' },

{ value: '6', label: 'Last month' }

];

selectedCharacter = '1';

 

 

UoStA_ajdi Pro User replied 6 months ago

Modified line 238 in select.component.ts to this

else if (typeof v === ‘string’ || typeof v === ‘number’ || typeof v === ‘boolean’ )

it is now working as desired. but can this please be added to the next release so we do not lose the changes on update.

UoStA_ajdi Pro User replied 6 months ago

This solution only works with String value. Can we have the ability for it to work with number and boolean as well?