タブセットを作成するために、次のように AngularUI Bootstrap を使用しています。
...
<tabset>
<tab heading="First Tab">
<div>First Content Here</div>
</tab>
<tab heading="Second Tab">
<div>Second Content Here</div>
</tab>
</tabset>
...
ページに出力されるコードは次のようになります。
...
<ul class="...">
<li ng-class="..." heading="First Tab" class="...">
<a href ng-click="select()" tab-heading-transclude class="ng-binding">
First Tab
</a>
</li>
<li ng-class="..." heading="Second Tab" class="...">
<a href ng-click="select()" tab-heading-transclude class="ng-binding">
Second Tab
</a>
</li>
</ul>
<div class="tab-content">
<!-- tab contents here -->
</div>
...
私が抱えている問題は、見出しリンクが欠落しているため、キーボードから選択できないことですtabindex
. 明らかに、angular はリストのフィラー HTML を作成しているため、それを追加することはできませんtabindex
。見出し属性の横にあるタブ要素にa を追加すると、それが必要なタグではli
なく、に追加されるだけです。a
tabindex
タブセットを定義し、ナビゲーション (見出し) リンクに配置するような属性を渡す方法はありますか?