Как сделать аккордеонные вкладки независимыми? - PullRequest
Новая
       5

Как сделать аккордеонные вкладки независимыми?

0 голосов
/ 21 марта 2019

У меня есть этот простой аккордеон, а внутри у меня есть 3 вкладки для аккордеона.Я хочу, чтобы все аккордеонные вкладки были открыты по умолчанию (у меня это уже работает).Моя проблема в том, что если я закрываю Аккордеонную Вкладку 1 , а затем открываю ее снова, закрывает все другие аккордеонные вкладки.Я хочу, чтобы, если я закрывал / открывал любую аккордеонную вкладку, то не должен влиять на все остальные вкладки.Кто-нибудь знает, как это сделать?Заранее большое спасибо!

Это то, что я хочу:

Рабочий пример

Это мой код:

LIVE DEMO 

<p-accordion>
 <p-accordionTab header="Accordion Tab 1" [selected]="true">
   <ul>
     <li>Colors</li>
     <li>Cities</li>
     <li>Facility</li>
     <li>Hobbies</li>
   </ul>
</p-accordionTab>
<p-accordionTab header="Accordion Tab 2" [selected]="true">
    <ul>
      <li>Students</li>
    </ul>
</p-accordionTab>
    <p-accordionTab header="Accordion Tab 3" [selected]="true">
    <ul>
      <li>Music</li>
    </ul>
 </p-accordionTab>
</p-accordion>

1 Ответ

2 голосов
/ 21 марта 2019

Добавьте [multiple]="true" к вашему p-accordion

<p-accordion [multiple]="true">
 <p-accordionTab header="Accordion Tab 1" [selected]="true">
   <ul>
     <li>Colors</li>
     <li>Cities</li>
     <li>Facility</li>
     <li>Hobbies</li>
   </ul>
</p-accordionTab>
<p-accordionTab header="Accordion Tab 2" [selected]="true">
    <ul>
      <li>Students</li>
    </ul>
</p-accordionTab>
    <p-accordionTab header="Accordion Tab 3" [selected]="true">
    <ul>
      <li>Music</li>
    </ul>
 </p-accordionTab>
</p-accordion>

подробнее о PrimeNG Docs :

...