Topic: Material Select not woking

Arturo Macías priority asked 6 years ago


Hi, i have just update MDB Angular pro to version 4.3.0 and change old ng-select to mdb-ng-select but it's not working. I have in template:
<div class="md-form form-sm">
    <i class="fa fa-venus-mars prefix"></i>
    <mdb-ng-select name="sexo" [options]="genderOptions" id="gender" placeholder="Selecciona el sexo" [(ngModel)]="patient.sexo" ></mdb-ng-select>
    <label>Sexo</label>
    <!--<small class="text-danger">error</small>-->
</div>
And in component, i load options this way:
ngOnInit() {
    this.genderOptions = [
        { value: 'HOMBRE', label: 'Hombre' },
        { value: 'MUJER', label: 'Mujer' }
    ];
}
But when i inspect page code, i see this tag:
<mdb-ng-select _ngcontent-c2="" id="gender" name="sexo" placeholder="Selecciona el sexo" ng-reflect-options="[object Object],[object Object" ng-reflect-placeholder="Selecciona el sexo" ng-reflect-name="sexo" ng-reflect-model="MUJER" class="ng-untouched ng-valid ng-dirty"><!--bindings={
"ng-reflect-ng-if": "false"
}-->
<div class="below" ng-reflect-ng-class="[object Object]" tabindex="0">

<!--bindings={
"ng-reflect-ng-if": "true"
}--><div class="single">
<!--bindings={
"ng-reflect-ng-if": "true"
}--><div class="value">
Mujer
</div>
<!--bindings={
"ng-reflect-ng-if": "false"
}-->
<!--bindings={
"ng-reflect-ng-if": "false"
}-->
<!--bindings={
"ng-reflect-ng-if": "false"
}-->
<!--bindings={
"ng-reflect-ng-if": "true"
}--><div class="toggle">
▼
</div>
</div>

<!--bindings={
"ng-reflect-ng-if": "false"
}-->

</div>
<!--bindings={
"ng-reflect-ng-if": "false"
}--></mdb-ng-select>
The select is not rendered and only one option is loaded. It seems i have forgotten something during update. I only have changed typescripts folder for pro download package. Any Idea?

Arturo Macías priority answered 6 years ago


I have declare genderOptions that way and update with versión 4.3.1, but selects are still not working...

Arturo Macías priority commented 6 years ago

Ok, i have found the problem, i hadn't imported updated scss folders. It's working again! Thanks!

Magdalena Obalska free answered 6 years ago


Hi, at first, remember to declare genderOptions like this: genderOptions: Array<any>;. You can download the new package from your profile and compare it to your updated version. In case of problems, contact us again.

Please insert min. 20 characters.

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: Priority
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags