我正在寻找一种方法,让ngbPanelHeader
触发ngb-accordion
中的内容以打开/关闭。似乎手风琴要求标题是内容打开/关闭的触发。
例如,如果<ng-template>
(在<ngb-panel>
内)中的<ngb-accordion>
被赋予ngbPanelTitle
属性,它将成功触发手风琴打开/关闭其内容。但是,如果相同的<ng-template>
具有ngbPanelHeader
属性,则不会。
任何解决方法的建议将不胜感激!
我发现,通过将单击事件处理程序附加到运行手风琴的toggle()函数的元素,并将<ng-panel>
元素的id传递为非按钮元素,可以将其解决方案用于非按钮元素该函数的参数。我已经更新了Stackblitz,以显示如何实现。
答案 0 :(得分:1)
https://stackblitz.com/edit/angular-te1eyn
ngbPanelTitle可以将其作为ng-bootsrap的默认设置,对于您的自定义模板,您需要将ngbPanelToggle添加到您的元素中
<button ngbPanelToggle >Panel Header That Doesn't Open Panel Content</button>
答案 1 :(得分:0)
后续活动与WCAG recommendations for accordion不符。这意味着很难为屏幕阅读器用户和其他一些具有辅助功能需求的用户使用。
每个手风琴标题的标题都包含在带有角色按钮的元素中。
当焦点位于折叠面板的手风琴标题上时,展开关联的面板...
至少有两个使用按钮元素的原因。很有可能还有更多。
根据经验,标记的语义始终是选择使用哪个元素的良好指南。