I am trying to use the ui-select directive in my angularjs but it is not displaying, i tried following the documentation and this is what i did:
<ui-select ng-model="form.gender" theme="bootstrap">
<ui-select-choices repeat="gender in genders">
{{ gender.name }}
</ui-select-choices>
</ui-select>
Then I have an array of genders:
$scope.genders = [
{
name: 'Male'
},
{
name: 'Female'
}
];
I haven't really used this directive before so I'm a bit confused as to what i am doing wrong.
There are no errors being displayed in my browser console, i have included the module in my app as well.
I want to use it for more than a simple dropdown of genders but i figure this is a start if i can do this then i won't have any more problems. :)
Edit: So i cleared my browser cache and refreshed my page and this time i did notice an error:
Error: [ui.select:transcluded] Expected 1 .ui-select-match but got '0'.
just add a class named as the tag.
<ui-select ng-model="form.gender" theme="bootstrap">
<ui-select-choices class="ui-select-choices" repeat="gender in genders">
{{ gender.name }}
</ui-select-choices>
</ui-select>