How to refresh heights in collection-repeat?

1

I am using an ng-if inside my collection-repeat markup which will change the item’s height. How can I get collection-repeat to update heights using getItemHeights() when the values change? It only seems to run on initialize.

      <div
        collection-repeat="item in items"
        collection-item-width="'100%'"
        collection-item-height="getItemHeight(item, $index)"
        >
          <div class="card">
            <div class="item item-divider item-stable"
            ng-if="show()">
              {{item.title}}
            </div>
            <div class="item item-image">
              <img ng-src="{{item.src}}" height="{{item.height}}">
           </div>       
      </div>
2

Here is a hack that seems to work, but can someone help me make this more “angular” friendly?

       // searching for the <ion-content class="ionic-scroll"> that wraps the collection-repeat
       // fire 'scroll.resize' to call renderOnResize() in collection-repeat
        element = document.getElementsByClassName('class-that-wraps-collection-repeat')
        ionScroll = ionic.DomUtil.getParentOrSelfWithClass(element.item(0), 'ionic-scroll')
        if ionScroll
          $timeout ()->
              angular.element(ionScroll).triggerHandler('scroll.resize');
            , 0


<div class="class-that-wraps-collection-repeat">
  <div collection-repeat="item in items" collection-item-height="getHeight(item,$index)">

  </div>
</div>
3

Very nice trick! I had similar problem were I need to change height of collection-repeat container, but it still keep showing only items that were visible initially (until you start scrolling or change size of browser).

4

No longer working in 1.0.0.rc0, but fixed in nightly. see: https://github.com/driftyco/ionic/issues/3292#issuecomment-78475147