AngularJS + UI Bootstrap: динамический Аккордеон - PullRequest
Новая
       29

AngularJS + UI Bootstrap: динамический Аккордеон

0 голосов
/ 19 января 2019

У меня есть некоторые проблемы при создании динамического аккордеона в AngularJS, потому что мой контент появляется не в том месте. Я хочу, чтобы аккордеоны для каждой группы отображали и скрывали своих пользователей так:

Название группы 1

первый пользователь группы 1
второй пользователь группы 1
..

Имя группы 2

первый пользователь группы 2
второй пользователь группы 2
..

Мой код выглядит так: 

<div class="list">
  <uib-accordion close-others="oneAtATime">
    <div uib-accordion-group is-open="status.isFirstOpen">

      <uib-accordion-heading>
        <div class="item item-divider" ng-repeat-start="group in addPerson_list | orderBy: 'name'" >
          {{ group.name }}
          <span>
            <i class="pull-right fa" ng-click="status.isFirstOpen = !status.isFirstOpen" ng-class="{'fa-arrow-up': status.isFirstOpen, 'fa-arrow-down': !status.isFirstOpen}"></i>
           </span>
        </div>
      </uib-accordion-heading>

      <a ng-repeat-end ng-repeat="person in group.users | orderBy: 'name'" ng-click="togglePerson(person)" class="item item-avatar item-icon-right">
        <h2>{{ person.name }}</h2>
        <i ng-if="person.invited" class="icon ion-ios-checkmark"></i>
        <i ng-if="!person.invited" class="icon ion-ios-circle-outline"></i>
      </a>

     </div>
  </uib-accordion>
</div>

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

...