Javascript 使用uib手风琴的条件标题颜色

我在angularjs应用程序中使用AngularUI。我的页面上有一个accordion（uib accordion）元素。其内容、名称和状态（打开/关闭）绑定到控制器中的数组

我希望实现以下行为：当选项卡关闭时，标题应为灰色。当它被打开时，它应该是另一种颜色。如何根据filter.isOpened的值执行此操作？我尝试了ng类，比如：

 ng-class="{'panel-blue-heading': filter.isOpened}"

但我没有做到这一点。下面是一把简单的小提琴，也许会有帮助。 谢谢

var-app=angular.module（“myApp”，“ui.bootstrap]”）；
app.controller（'testCtrl'，['$scope'，函数（$scope）{
$scope.filtersInfo=[{
过滤器参数：[1,2,3,4]，
过滤器名称：“测试过滤器”，
真的吗
}];
}]);
.panel默认值{
边界：0；
}
.小组{
边缘底部：5px；
}
.小组委员会{
填充物：5px；
}
.panel默认值>.panel标题{
颜色：黑色；
}
.panel蓝色标题>.panel标题{
背景色：#42c6eb；
颜色：黑色；
}
.集装箱{
填充：10px；
边界半径：15px；
边框：1px纯黑；
}

{{filter.filterName}
…我的内容。。。
你就快到了：

<uib-accordion close-others="oneAtATime" ng-class="{'opened': filter.isOpened}" id="my-accordion">

我添加ID是为了不影响任何其他不打算有蓝色背景的面板标题


var-app=angular.module（“myApp”，“ui.bootstrap]”）；
app.controller（'testCtrl'，['$scope'，函数（$scope）{
$scope.filtersInfo=[{
过滤器参数：[1,2,3,4]，
过滤器名称：“测试过滤器”，
真的吗
}];
}]);
#my-accordion.opened.面板标题{
背景颜色：蓝色；
}
.面板默认值{
边界：0；
}
.小组{
边缘底部：5px；
}
.小组委员会{
填充物：5px；
}
.panel默认值>.panel标题{
颜色：黑色；
}
.panel蓝色标题>.panel标题{
背景色：#42c6eb；
颜色：黑色；
}
.集装箱{
填充：10px；
边界半径：15px；
边框：1px纯黑；
}

{{filter.filterName}
…我的内容。。。
你就快到了：

<uib-accordion close-others="oneAtATime" ng-class="{'opened': filter.isOpened}" id="my-accordion">

我添加ID是为了不影响任何其他不打算有蓝色背景的面板标题


var-app=angular.module（“myApp”，“ui.bootstrap]”）；
app.controller（'testCtrl'，['$scope'，函数（$scope）{
$scope.filtersInfo=[{
过滤器参数：[1,2,3,4]，
过滤器名称：“测试过滤器”，
真的吗
}];
}]);
#my-accordion.opened.面板标题{
背景颜色：蓝色；
}
.面板默认值{
边界：0；
}
.小组{
边缘底部：5px；
}
.小组委员会{
填充物：5px；
}
.panel默认值>.panel标题{
颜色：黑色；
}
.panel蓝色标题>.panel标题{
背景色：#42c6eb；
颜色：黑色；
}
.集装箱{
填充：10px；
边界半径：15px；
边框：1px纯黑；
}

{{filter.filterName}
…我的内容。。。
它是
filter.isOpen
还是
filter.isopend
？请确保您没有输入错误。@Izagkaretos，这是小提琴中的输入错误，我删除了一些内容，因为实际内容更大。是
filter.isOpen
还是
filter.isopend
？请确保你没有输入错误。@Izagkaretos，这是小提琴中的输入错误，我删除了一些东西，因为实际内容更大。是的，我非常接近。谢谢你的解决方案，效果很好。是的，我很接近。谢谢你的解决方案，它工作得很好。