如何在Angular中设置选择下拉菜单选项的样式

<!-- dropdown.component.html -->
<div class="dropdown">
  <button class="dropdown-toggle" (click)="toggleDropdown()">
    {{ selectedOption }}
  </button>
  <ul class="dropdown-menu" *ngIf="isDropdownOpen">
    <li *ngFor="let option of options" (click)="selectOption(option)">
      {{ option }}
    </li>
  </ul>
</div>

<!-- dropdown.component.css -->
.dropdown {
  position: relative;
}

.dropdown-toggle {
  /* 设置按钮的样式 */
}

.dropdown-menu {
  /* 设置下拉菜单的样式 */
}

.dropdown-menu li {
  /* 设置下拉菜单选项的样式 */
}

/* dropdown.component.ts */
import { Component } from '@angular/core';

@Component({
  selector: 'app-dropdown',
  templateUrl: 'dropdown.component.html',
  styleUrls: ['dropdown.component.css']
})
export class DropdownComponent {
  isDropdownOpen = false;
  selectedOption: string;
  options = ['Option 1', 'Option 2', 'Option 3'];

  toggleDropdown() {
    this.isDropdownOpen = !this.isDropdownOpen;
  }

  selectOption(option: string) {
    this.selectedOption = option;
    this.isDropdownOpen = false;
  }
}