I have a multiselect drop down but I only want to select one of the options and then when that modal opens have that dropdown selection saved.
right now the dropdown is multi and when i close the modal, the values are still selected. I want this same functionality but in a single select dropdown. Not sure what I am missing.
<md-select ng-model="itemSet.filters["names"].values" multiple aria-label="{{itemSet.filters["names"].label}}">
<md-option ng-value="item" ng-repeat="item in itemSet.filters["names"].options">{{item.label}}</md-option>
</md-select>
when I remove the multiple option in the md-select i get the error in console : this.values.forEach is not a function
this is my itemSet names object.
'names': {
class: 'Filter',
name: 'names',
label: 'names',
labelField: 'label',
options: [
{
label: 'filled',
api: 'table',
key: '!VACANT'
},
{
label: 'vacant',
api: 'table',
key: 'VACANT'
}
]
pretty much stuck at this point and any guidance would be super cool. I just want to be able to select one from the dropdown and then keep that there when the modal that has this opens up.
When in multiple mode, ng-model
is an array of values. But since you got rid of the multiple
attribute, it contains only the single selected value, which of course has no forEach
method. You have not included the controller code where you iterate over this.values
, but that's where you need to change things, as well as changing the dropdown to:
<md-select ng-model="itemSet.filters["names"].value" aria-label="{{itemSet.filters["names"].label}}">
<md-option ng-value="item" ng-repeat="item in itemSet.filters["names"].options">{{item.label}}</md-option>
</md-select>
In your controller, use this.value
directly (assuming this
=== itemSet.filters["names"]
).