Свернуть кнопку для конкретного идентификатора начальной загрузки 3 на угловой 6 - PullRequest
0 голосов
/ 06 июня 2018

Я пытаюсь показать конкретный текст с помощью кнопки «Свернуть» в начальной загрузке 3 и угловой 6 (согласно этим инструкциям - https://valor -software.com / ngx-bootstrap / # / collapse # accessibility ).

Я использую следующий код:

<button type="button" class="btn btn-primary" (click)="collapse.show()"
        aria-controls="collapseManual1">Show content
</button>

<hr>
<div id="collapseManual1" #collapse="bs-collapse" [collapse]="!isOpen"
     class="card card-block card-header">
  <div class="well well-lg">Some content1</div>
</div>
<div id="collapseManual2" #collapse="bs-collapse" [collapse]="!isOpen"
     class="card card-block card-header">
  <div class="well well-lg">Some content2</div>
</div>

Я написал его, чтобы посмотреть, смогу ли я каким-то образом свернуть первый div, но он не работает, только кодсвернуть второй див.Ария-контроль ничего не влияет.Кажется, что последний элемент, который имеет # collapse = "bs-collapse" - это то, что показано.

Я также пытался добавить data-target:

<button type="button" class="btn btn-primary" (click)="collapse.show()" data-target="#collapseManual1" aria-controls="collapseManual1">Show content
</button>

и href:

<button type="button" class="btn btn-primary" (click)="collapse.show()" href="#collapseManual1" aria-controls="collapseManual1">Show content
</button>

Но результаты были одинаковыми.

Как можноЯ заставляю collapse.show () работать с определенным идентификатором?

1 Ответ

0 голосов
/ 06 июня 2018

Вы присваиваете одну и ту же переменную ссылки шаблона #collapse обоим вашим элементам div

Попробуйте использовать разные переменные, такие как #collapseone и #collapsetwo В противном случае я думаю, что они сами конфликтуют

...