JSFiddle - React, Tailwind, and code Playground
HTML
<html data-ng-app="app">
<head></head>
<body data-ng-controller="CompanyController">
<select>
<option data-ng-repeat="company in companies" data-ng-class="getCompanyClass(company)">{{company.name}}</option>
</select>
</body>
</html>
CSS
.green {
background-color: green;
}
.blue {
background-color: blue;
}
JavaScript
angular.module('app', []).controller("CompanyController", ['$scope',
function ($scope) {
$scope.companies = [{
name: "ABB",
active: false
}, {
name: "Siemens",
active: true
}, {
name: "Fanuc",
active: false
}, {
name: "Motorola",
active: false
}];
$scope.getCompanyClass = function (company) {
return company.active ? "green" : "blue";
};
}]);