Ionic Select component with dynamic Items?

ionic-v1
1

Hello,

how do I have to go about creating a Ionic Select component that shows dynamically generated items (e.g. from an array)? It seems that something like ng-repeat wont work on the select tag.

2

Ng-repeat works fine in the select tag.

<select>
  <option ng-repeat="item in items" >
    Item {{ item.id }}
  </option>
</select>
3

Ah, thanks! I did it wrong, tried to use ng-repeat on the select, not the option tag. One question though: How do you change it in this case to use the ‘selected’ attribute on a specific item?

4

You can use ng-repeats $index and select what ever item you want in your array.

https://docs.angularjs.org/api/ng/directive/ngRepeat

5

@mhartington - building on this example, would you consider providing a wonderful community service by demonstrating the best way to set up conditional dynamic selects on nested json data like this countries>state>cities json?

6

One of the best ways to do select boxes with angular (and I am pretty sure the ‘official’ way) is using ng-options. There are a lot of resources on it.

I am writing a web app right now that does that exact thing you’re asking, but with sizes relative to gender and the clothing type. Essentially you just have your different lists, and then you just show/hide different cities and so forth using ng-show or ng-if depending on the selection.

So ng-options and ng-show :slight_smile: Good luck!

7

How do I bring the first item from my already selected array?