Question

我有一个简单的手风琴，为了展开/折叠每个面板，我想仅点击标题文字每个面板和整个面板标题上的 NOT 。有谁知道如何实现这一目标？

例如，如果我点击标题1 文字，我希望面板展开/折叠 这是我的代码：

<p-accordion>
 <p-accordionTab header="Header 1">
   Content 1
 </p-accordionTab>
 <p-accordionTab header="Header 2">
    Content 2
 </p-accordionTab>
 <p-accordionTab header="Header 3">
    Content 3    
 </p-accordionTab>
</p-accordion>

Answer 1

执行此操作的一种方法是使用primeng p-header中的自定义模板SharedModule：

<p-accordion>
    <p-accordionTab>
       <p-header>Header 1</p-header>
       Content 1
    </p-accordionTab>
    <p-accordionTab>
       <p-header>Header 2</p-header>
        Content 2
    </p-accordionTab>
    <p-accordionTab>
        <p-header>Header 3</p-header>
        Content 3    
    </p-accordionTab>
</p-accordion>

现在您需要为全局css文件添加一些规则：

.ui-accordion-header {
  pointer-events: none;
}

.ui-accordion-header p-header {
  pointer-events: auto;
}

Forked Plunker

如何在单击文本而不是整个页眉面板时单击面板？

1 个答案: