您可以使用Angular的指令和样式绑定来给标题下拉菜单添加活动样式。以下是一个示例解决方案:
ngClass
指令和组件的属性来绑定样式类:
标题
-
下拉菜单项1
-
下拉菜单项2
isMenuActive
,并在需要时更新该属性的值:export class YourComponent {
isMenuActive = false;
toggleMenu() {
this.isMenuActive = !this.isMenuActive;
}
}
.active {
/* 活动样式 */
background-color: #f00;
color: #fff;
}
isMenuActive
属性的值,以实现在用户与下拉菜单交互时切换活动样式。例如,可以在下拉菜单项上添加点击事件处理程序,并在处理程序中调用toggleMenu
方法:
下拉菜单项1
这样,当用户点击下拉菜单项时,isMenuActive
属性的值将切换,并且相应的样式将应用于标题和下拉菜单项。