Question

考虑下面的标记。这是手风琴的情况。我必须将不同的css（背景颜色）应用于打开的那个。为此，我希望使用ng-class指令。现在打开的标题始终将aria-expanded属性设置为true。对所有其他人都是假的。

<v-pane-header class="header ng-scope ng-isolate-scope" role="tab" tabindex="0" aria-selected="true" aria-expanded="true">

我怎样才能做到这一点。我知道如何对任何模型变量等进行操作。注意aria-expanded属性由accordion插件自动添加。

Answer 1

我采用了一种非常不同的方法来解决这个问题。我没有通过我的代码中的ng-class或任何其他函数或方法来实现这一点，而是使用了手风琴插件本身。手风琴动态添加aria-expanded属性。所以我在插件添加aria-expanded属性的地方对插件代码和应用样式属性进行了更改。现在它完美无缺。

function expand() {
    accordionCtrl.disable();

    paneContent.attr('aria-hidden', 'false');

    paneHeader.attr({
        'aria-selected': 'true',
        'aria-expanded': 'true',
        'style': 'background-color:#FFF0C9 !important'  // Added style here. Can add a class too though.

    });

    emitEvent('onExpand');
    // Rest of the code......

这不是我通过ng-class做这个问题的答案，但是却为任何试图达到类似事情的人提供了一种可行的方法。

基于属性值通过ng-class添加和删除类

1 个答案: