2

Я генерирую "ui-bootstrap accordion" от ng-repeat. Я хочу динамически обновлять значение списка. Но когда я обновляю значение вложенного списка, second accordion не работает.AngularJs: Вложенный UI-Bootstrap аккордеон не работает, когда значение списка обновлений

<uib-accordion close-others="oneAtATime"> 
     <uib-accordion-group heading="{{prInfo.name}}" 
      data-ng-repeat="(a,prInfo) in allPersonInfoNames | filter:prSearchFilter"> 
      Below iss the inner accordion 
      <uib-accordion close-others="oneAtATime"> 
       <uib-accordion-group heading="Static Payroll Header, inner accordion" 
        data-ng-repeat="(b,payroll) in prInfo.banks"> 
        This content is straight in the template. 
       </uib-accordion-group> 
      </uib-accordion> 

     </uib-accordion-group> 
     <uib-accordion-group heading="{{group.title}}" ng-repeat="group in groups1"> 
      {{group.content}} 
     </uib-accordion-group> 
    </uib-accordion> 

Этот код написан правильно, но когда я генерировать список banks после загрузки HTML, accordion не работает.

добавить ng-click="getBanks(prInfo)" к первому аккордеона:

<uib-accordion-group heading="{{prInfo.name}}" 
    data-ng-repeat="(a,prInfo) in allPersonInfoNames | filter:prSearchFilter" 
    ng-click="getBanks(prInfo)"> 

$scope.getBanks = (personInfo) -> 
     $scope.prResPromise = Cartable.httpReq('GET', "getBanks/#{personInfo.dbId}", null, (res) -> 
      if res.isSuccess 
      pi = _.findWhere($scope.allPersonInfoNames, {'dbId' : personInfo.dbId}) 
      index = $scope.allPersonInfoNames.indexOf(pi) 
      $scope.allPersonInfoNames[index] = res 

После этого изменения, вложенная аккордеон не работает, и первый аккордеон не открывается, а второй аккордеон не генерирует.

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

Я делаю это с помощью бутстрапа аккордеона, но у вас есть эта проблема снова.

+2

Любой плункер или jsfiddle, чтобы посмотреть полный код? – Yaser

+0

@YaserAdelMehraban Я пытаюсь добавить плункер. – mgh

+0

@YaserAdelMehraban Когда я пытаюсь добавить плункер, я нашел проблему. Проблема - это версия 'ui-bootstrap ', я меняю версию с 0.3 на 2.3.1, и ошибка исправлена. – mgh

ответ

1

Я решил проблему на 2 стадии,

первое обновление версии ui-bootstrap от 0.3 к 2.3.1, а затем добавить specifice is-open к каждому из accordion.

  <uib-accordion close-others="oneAtATime1"> 
       <div uib-accordion-group class="panel-default" is-open="prInfo.isOpen" heading="{{prInfo.name}}" 
        ng-repeat="prInfo in allPersonInfoNames"> 
        <uib-accordion close-others="oneAtATime2"> 
         <div uib-accordion-group class="panel-default" heading="{{payroll.logPeriod.name}}" 
          is-open="payroll.isOpen" 
          ng-repeat="payroll in prInfo.payrolls"> 
          <div class="row"> 
           <div class="col-md-4"> 
            <h1>in nested accordion</h1> 
           </div> 
          </div> 
         </div> 
        </uib-accordion> 
       </div> 
      </uib-accordion>