2

如何在展开的选项卡上更改手风琴标题图标？

Accordion plunke URL 是：http ://plnkr.co/edit/7HMhoHk9AWyBAHALgD0P?p=preview

 <accordion-group>
        <accordion-heading>
            I can have markup, too! <i class="icon-check"></i>
        </accordion-heading>
        This is just some content to illustrate fancy headings.
    </accordion-group>
  </accordion>

所以基本上我想改变图标检查类让我们说图标取消检查，当标签展开时

4

3 回答 3

6

这应该做你想要的..

  <accordion-group is-open="$parent.isOpen">
    <accordion-heading>
        I can have markup, too! 
        <i ng-class="{'icon-minus':isOpen,'icon-plus':!isOpen}"></i>
    </accordion-heading>
    This is just some content to illustrate fancy headings.
  </accordion-group>

这是一个有效的插件：http://plnkr.co/edit/kxKVsqHa1a64RvOUbVcM? p =preview

更新

上面的代码不能正常工作。它一次折叠/展开手风琴中的所有组。

看看这个 Plunker 以获得更好的解决方案： http ://plnkr.co/edit/RQKAoY04eVj1ysIikRxU?p=preview

于 2013-09-06T20:45:03.830 回答
2

对于更改图标 

<accordion close-others="true" is-open="group.open">
    <accordion-group ng-repeat="group in groups">
        <accordion-heading>
            <i ng-class="{'icon-minus-sign':groups[$index].open,'icon-plus-sign':!groups[$index].open }"></i>
           [{{$index + 1}}] {{group.title}}
        </accordion-heading>
        {{group.content}}
     </accordion-group>

于 2013-10-18T14:31:10.403 回答
0

您可以尝试将脚本添加到以手风琴标题类为目标的页面中以更改类属性到您想要的图标。也许您可以参考这些帖子以了解如何执行此操作。

Twitter Bootstrap 手风琴图标没有改变

将打开/关闭图标添加到 Twitter Bootstrap 可折叠项（手风琴）

于 2013-09-06T17:51:31.630 回答