Topic: Material Select Doesn't Support biding to [(ngModel)]
rctoone pro asked 7 years ago
There doesn't seem to be a way to bind the material select component to an ngModel
<mdb-select #productTypeSelect name="productTypeSelect" [options]="productDetailEditOptions.productTypeOptions" [(ngModel)]="blankProduct.productType"></mdb-select> <label>Product Type <i class="fa fa-angle-down float-right"aria-hidden="true"></i> </label>
When i have the code above it gives a java script error.
ERROR Error: Uncaught (in promise): TypeError: Value must be a string or an array.
TypeError: Value must be a string or an array.
Is there a way to set the value with a model? All the other mdb components i have used support binding to an ngModel so it seems a bit out of place that material select doesn't support this.
In my code blankProduct.productType is an object with the following { label: string, value: string } which is the same object used for the [options]
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Opened
- ForumUser: Pro
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Alberto pro commented 7 years ago
Did you try using ToArray() on your observable?rctoone pro commented 7 years ago
Sorry but that didn't work i also tried passing in a string. I should clarify that the error i am getting is coming from angular not mdb. Which likely means i am not using the component correctly or MDB does not support this.rctoone pro commented 7 years ago
Has anyone been able to use the Material Select component and two way bind with [(ngModel)]?Dawid Adach pro commented 7 years ago
Could you also provide .ts part to see what type of data are you trying to bind?rctoone pro commented 7 years ago
so the [options] binding works using array of objects of the following: export class MdbSelectOption { value: string; label: string; } I used the same class for the [(ngModel)] binding. I would expect that the [(ngModel)] binding to work on the same object. Though you don't have any documentation to support this. Can you provide documentation with an example of using Material Select with two way [(ngModel)] binding?Dawid Adach pro commented 7 years ago
Dear rctoone, we will update our docs shortly, please refer to the following topic: https://mdbootstrap.com/support/mdb-select-cannot-use-ngfor/ you will find example over there.