Stefanos Chrs
Stefanos Chrs

Reputation: 2518

Ionic Accordion Reflow

I am using the Ionic Accordion List from here and I have an issue with the screen height (this official example also has that problem), when you open an accordion the screen height remains the same as before when it was closed so when you try to scroll it doesn't go further down for example. If you try a second time to scroll usually it does but other times you need to touch-drag a specific area so you can scroll.

  <ion-list>
    <div ng-repeat="group in groups">
      <ion-item class="item-stable"
                ng-click="toggleGroup(group)"
                ng-class="{active: isGroupShown(group)}">
          <i class="icon" ng-class="isGroupShown(group) ? 'ion-minus' : 'ion-plus'"></i>
        &nbsp;
        Group {{group.name}}
      </ion-item>
      <ion-item class="item-accordion"
                ng-repeat="item in group.items"
                ng-show="isGroupShown(group)">
        {{item}}
      </ion-item>
    </div>
  </ion-list>

Upvotes: 1

Views: 1922

Answers (2)

Ian Pinto
Ian Pinto

Reputation: 2299

I was experiencing a similar accordion reflow issue and was able to resolve the same by calling $ionicScrollDelegate.resize() in the accordion toggle (show/hide) function.

Upvotes: 0

devrecur
devrecur

Reputation: 24

Its been very long and not sure whether you already fixed this issue. Based on my understanding, i think that there is some delay in triggering the resize event.

Not sure about the permanent solution but for temporarily we have the invoke by $ionicScrollDelegate.resize().

I hope this works for you and please let me know if am wrong. Also please do share if you find any alternative solution for this problem.

Upvotes: 1

Related Questions