mdb-select drop down list length

<div class="row">

<div class="col-md-6 mx-auto my-5">

<mdb-select #select [options]="optionsSelect"placeholder="Choose your option"customClass="" (focusin)="openSelect()"></mdb-select>

<label>Example label</label>

</div>

</div>

@ViewChild('select') select: SelectComponent;

optionsSelect:Array<any>;

ngOnInit() {

this.optionsSelect= [

{ value: '1', label: 'Option 1' },

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

{ value: '3', label: 'Option 3' },

];

}

openSelect() {

this.select.openDropdown();

}

mdb2 pro commented 6 years ago

Thanks Damian, This solution does work ! However, what should I do if I have many such components in a form when only one can have 'select' as an id ? Will you add this to the next release ?

---

Damian Gemza staff commented 6 years ago

Dear mdb2, I cannot promise you, that your desired feature will be added with the next release of MDB Angular, but we'll do our best to add it in future. Best Regards, Damian

---

mdb2 pro commented 6 years ago

what should I do if I have many such components in a form when only one can have ‘select’ as an id ?

---

Damian Gemza staff commented 6 years ago

Dear mdb2, The only workaround, for now, is to do as many @ViewChild as many selects you have and do this.select.openDropdown() method on each one. We'll do our best to provide a functionality to open dropdown with focus in future release. Best Regards, Damian

---

mdb2 pro commented 6 years ago

Hi Damian, Regarding "The only workaround, for now, is to do as many @ViewChild as many selects you have and do this.select.openDropdown() method on each one." If I use (focusin)="openSelect($event)" on all select elements, will I be able to extract the element from the event and then call el.openDropdown(); on it ?

---

Arkadiusz Idzikowski staff commented 6 years ago

Dear mdb2, The event target should point to the specific select, so yes, you should be able to do that. If you will have any problems please let me know. Best, Arek

---

<mdb-select formControlName="iBusinessType" [options]="businessTypes" (focusin)="openSelect($event)" customClass=""></mdb-select>

const select = event.currentTarget as SelectComponent;

select.openDropdown();

Arkadiusz Idzikowski staff commented 6 years ago

Dear mdb2, In that case event points to some div wrapper and not to the select directly. Problem with select focus will be fixed in new version, for now please use solution with @ViewChild. Best, Arek

---