Я использую динамические панели.Я использовал кнопки «свернуть».Проблема в том, что кнопка сворачивания работает только для первой панели

Question

Я использую динамические панели. На данный момент я жестко закодировал данные в моем файле JS. Я использовал кнопку свертывания. Проблема в том, что кнопка сворачивания отлично работает только для первой панели. Хотя кнопка свертывания появляется на других панелях, она не работает.

Может кто-нибудь, пожалуйста, помогите мне?

Кроме того, я использовал пользовательскую директиву для использования динамических панелей.

Answer 1

Проблема в том, что вы использовали один и тот же идентификатор в data-target.Вы должны учитывать уникальный идентификатор цели и цель для каждого элемента. Я предлагаю использовать $ index для ng-repeat, также лучше всегда использовать track by для ng-repeat в вашем случае track by $ index Редактируемый код:

    <div class="text-center">
       <button type="button" class="btn btn-default collapsed" data-toggle="collapse" 
           data-target="#demo-{{$index}}">
        VIEW DETAILS
       </button>
    </div>
    <div id="demo-{{$index}}" class="collapse">
        Lorem ipsum 
    </div>

Если проблема не решена, пожалуйста, подготовьте поршень, чтобы быть более конкретным.