How do I use set the same class for each option in a dropdown using ng-options in Angular 1.x

Question

I have a dropdown menu and would like to have the options all have the same class, how is this done using AngularJS?

        <select options-class="rules-option" ng-init="rule.actionId" ng-class="rules-option" ng-model="rule.selectedAction" ng-options="team.name for team in teams track by team.id">
            <option value="">Select Team</option>
        </select>

The above code doesn't appear to set classname of any of the generated options

Just use an `ng-repeat` on an `option` element; it doesn't look like you're using any advanced features of `ng-options`... — Heretic Monkey, Nov 30 '16 at 21:40

score 0 · Accepted Answer · edited May 23 '17 at 11:53

0

You can apply CSS to elements

like

select option
{
  color:red;
  font-style:italic
}

If you need more generic way i would suggest refer this link

OR

<select ng-model="Blah">
      <option ng-repeat="person in persons" class="<your class>">{{person.Name}}</option>  
    </select>

Here is the Sample

edited May 23 '17 at 11:53

Community

1
1

answered Nov 30 '16 at 21:13

user3249448

1,369
2
14
34

How do I use set the same class for each option in a dropdown using ng-options in Angular 1.x

1 Answers1