如何在angular-2-dropdown-multiselect的下拉元素中设置文本样式？

Question

这是我的代码

HTML

<div class="col-md-7">
                    <ss-multiselect-dropdown [options]="menuCategoriesOptions" [texts]="myTexts" name="menuCategoriesModel" [settings]="mySettings"
                        [(ngModel)]="menuCategoriesModel" (ngModelChange)="onChange($event)">
                    </ss-multiselect-dropdown>
</div>

组件

menuCategoriesModel: number[] = [];
  mySettings: IMultiSelectSettings = {
      enableSearch: true,
      checkedStyle: 'checkboxes',
      containerClasses : 'dropdown-inline',
      buttonClasses: 'btn btn-default btn-block',
      dynamicTitleMaxItems: 10,
      displayAllSelectedText: true,
      showCheckAll: true,
      showUncheckAll: true
  };
  myTexts: IMultiSelectTexts = {
      checkAll: 'Select all',
      uncheckAll: 'Unselect all',
      checked: 'item selected',
      checkedPlural: 'items selected',
      searchPlaceholder: 'Find',
      searchEmptyResult: 'Nothing found...',
      searchNoRenderText: 'Type in search box to see results...',
      defaultTitle: 'None Selected',
      allSelected: 'All selected',
  };
  menuCategoriesOptions: IMultiSelectOption[] = [
      { id: 1, name: 'Starters' },
      { id: 2, name: 'Main Course' },
      { id: 3, name: 'Desserts' },
      { id: 4, name: 'Wraps' },
      { id: 5, name: 'Breads' },
      { id: 6, name: 'Soups' },
      { id: 7, name: 'Salads' },
      { id: 8, name: 'Drinks' },
      { id: 9, name: 'Shakes' },
      { id: 10, name: 'Rice Items' },
      { id: 11, name: 'Chinese' },
      { id: 12, name: 'Fresh Cakes' },
      { id: 13, name: 'Biryanis' },
      { id: 14, name: 'Fast Food' },
      { id: 15, name: 'Italian' }
  ];

下拉元素的文本颜色为蓝色，当我们在下拉列表中选中复选框时，文本是不可见的，因为所选复选框背景颜色也相同（蓝色）。所以我需要将文本设置为不同的颜色。

Answer 1

我通过更改angular-2-dropdown-multiselect节点模块中所选下拉值的背景颜色来解决此问题。

我更改的文件： dropdown.component.js

路径： .. \ node_modules \ angular-2-dropdown-multiselect \ dropdown

添加了css代码：

.dropdown-item.active,.dropdown-item:active{background-color: #000;}

dropdown image with the black background for the selected values