2

現在、プロジェクトを jQuery から AngularJS に移植しています。jQuery には次のコードがあります。

jQuery コード

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

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

AngularUI にアイコン オプションが見つかりません。AngularUI アコーディオンにヘッダー画像を追加する回避策はありますか? アイコンに素晴らしいフォントを使用してみました

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

上記のコードには、同じ行ではなく、隣接する行にアイコンと見出しがあります。

4

2 に答える 2

14

http://angular-ui.github.io/bootstrap/のアコーディオン ディレクティブを使用していて、アコーディオンの見出しにカスタム HTML を使用したい場合は、(属性を中継する代わりに)<accordion-heading>内の要素を使用できます。<accordion-group>heading

次に例を示します。

<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>

そして、作業プランク: http://plnkr.co/edit/E4QtpTYpHkMmcZhUPZsK?p=preview

于 2013-04-24T11:31:45.580 に答える