javascript - AngularJS select,设置下拉菜单项的背景色

标签 javascript css angularjs select

我有一个包含许多元素的下拉列表,如果我单击选择以显示列表,我想用不同的颜色突出显示该列表中的某些元素。

预期行为:当我们单击“选择”(在选择任何元素之前)时,如果标记 Obligatory 为真,如何使列表中的元素“Section3”以黄色(背景部分)突出显示?

$scope.globalSections = [
        {name: 'Section1', department: 'Summary'},
        {name: 'Section2', department: 'Group1'}, 
        {name: 'Section3', department: 'Group1', obligatory: true},
        {name: 'Section4', department: 'Group2'},
        {name: 'Section5', department: 'Group2'}
      ];
      $scope.selectedSection = $scope.globalSections[0]; // Summary

<select ng-model="selectedSection" ng-options="section.name group by section.department for section in globalSections">

plnkr version

最佳答案

所以这不会是您想要的答案,但您将无法在不伪造它的情况下以跨浏览器的方式完成此操作。对于另一个元素,我想完成与此类似的事情,唯一的方法是制作一个伪造的选择对象或使用像

这样的第三方库

https://select2.github.io/examples.html或者 https://github.com/angular-ui/ui-select

关于javascript - AngularJS select,设置下拉菜单项的背景色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30223113/

相关文章:

javascript - 将 grunt 与现有的 wordpress 实例一起使用

internet-explorer - IE 8+ 中的 CSS 渐变适用于网站的所有部分,除了一个

angularjs - 如何在具有环回和 Angular 的两个对象之间创建正确的 hasOne 关系

javascript - 使用Angular提取特定的Json数据

javascript - 什么是单例对象?

javascript - 使用不断变化的参数查找值范围的可能排列

javascript - jqueryUI 可调整大小和可拖动不能一起工作

javascript - 如何在不重新加载页面的情况下使用ajax聊天网站

javascript - 使用 div 动态显示列,第一列固定,其余列使用水平滚动条

html - 在 div 中间画一个圆