在AngularUI手风琴标题图片 [英] Accordian header images in AngularUI

问题描述

所以，即时通讯目前从jQuery的移植我的项目AngularJS，我有以下的code jQuery中

So im currently porting my project from jQuery to AngularJS, I have the following code in jQuery

jQuery的code

$(document).ready(function()
{
    var icons = {
      header: "ui-icon-circle-arrow-e",
      activeHeader: "ui-icon-circle-arrow-s"
    };

    $( "#Session" ).accordion({
      icons: icons
    });
}); 

我不觉得在AngularUI任何图标选项。有任何解决方法在AngularUI手风琴添加标题图片？试图使用的字体真棒为图标

I dont find any icons option in AngularUI. Is there any workaround to add header images in AngularUI accordion? Tried to used font awesome for icons

<accordion-group heading="My Current Sessions" class="icon-book">
      <div>Content Goes here</div>
</accordion-group>

以上code的图标，并在相邻线路走向，而不是在同一直线上。

The above code has icon and heading on adjacent lines, and not on same line.

推荐答案

如果您使用的是 HTTP手风琴指令：// angular-ui.github.io/bootstrap/ 并希望有自定义HTML在你的手风琴的标题，你可以使用＆LT;手风琴标题＆GT; 元素中＆LT;手风琴组＆gt; （而不是中继上的标题属性）

If you are using the accordion directive from http://angular-ui.github.io/bootstrap/ and want to have custom HTML in your accordion heading you can use the <accordion-heading> element inside the <accordion-group> (instead of relaying on the heading attribute).

下面是一个例子：

<accordion>
    <accordion-group>
      <accordion-heading>
        Put any HTML <strong>here</strong><i class="icon-book"></i>
      </accordion-heading>
      This content is straight in the template.
    </accordion-group>
  </accordion>

和工作普拉克：<一href=\"http://plnkr.co/edit/E4QtpTYpHkMmcZhUPZsK?p=$p$pview\">http://plnkr.co/edit/E4QtpTYpHkMmcZhUPZsK?p=$p$pview

这篇关于在AngularUI手风琴标题图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！