How to use mui-select with AngularJS with dynamic data

[gkimpson]

I am able to perfectly utilise the mui-dropdown using the code below, however when I try a similar approach with the mui-select option it doesn't generate correctly.

<mui-dropdown color="primary" label="Select a team" > <mui-dropdown-item ng-repeat="team in teams" link="#/link1">{{ team.name }}</mui-dropdown-item> </mui-dropdown>

I am trying to generate the select with the code below, but when I reload the page and click the select menu I only see one option (I am expecting 4) and it has {{option.label}} (note - the select is already opened by default - i do not want this to happen) <mui-select ng-model="rule.selectedAction" ng-options="team.name as label in teams" use-default> <mui-option value="{{ team.id }}" label="{{ team.name }}"></mui-option> </mui-select>

Please advise on my issue

[amorey]

Hi @gkimpson - The MUI Select component doesn't support a list of options as an argument yet. Do you have time to take a stab at adding that functionality? The code is here: https://github.com/muicss/mui/blob/master/src/angular/select.js

[gkimpson]

Ok I see - i'll have a go, although I am sure many others would need this so I am glad this ticket has been given a high priority.

[amorey]

Glad to hear you want to have a go at it - it might require some advanced Angular knowledge but it should be an interesting problem to work on.

In terms of setting up the development environment, these instructions should work: https://github.com/muicss/mui#development-quickstart

There are some examples in the examples/angular/select.html file so you can add an options list example there: https://github.com/muicss/mui/blob/master/examples/angular/select.html

In case it helps, here's Angular's source code for ngOptions (hopefully we can come up with a simpler solution for MUI): https://github.com/angular/angular.js/blob/245b27101aad129061585252b73652054319ca82/src/ng/directive/ngOptions.js

Let me know if there's anything else I can do to help!

[amorey]

@gkimpson I was just thinking about this problem. Have you tried using ng-repeat to add <mui-option> elements dynamically?

[gkimpson]

@amorey Hi sorry for the delay, I tried ng-repeat initially but soon realised that wouldn't work and i'd need to make some amendments to MUI Select component in the core mui javascript file. If anybody does find a solution that would be brilliant!

[amorey]

Interesting - what happened when you tried using ng-repeat? Do you have a branch with your changes? Let me know and I can merge it into the master.