why list is not display while using collection-repeat instead of ng-repeat

I used ng -repeat in my demo .But due to large data coming from service .I want to use collection-repeat for performance better .how I will use collection-repeat to get the same out put here .here is my plunker

<ion-scroll scrollbar-y="true" delegate-handle="i" ng-style="viewHeight">
          <div class="row" ng-repeat="column in i | limitTo: counter  track by $index" ng-class-odd="'odd-row'">
            <div class="col brd collapse-sm" ng-repeat="field in column.columns" ng-show="i[$index].checked && i[$index].f===field.fieldNameOrPath">{{field.value}}</div>
            <div class="col col-10 text-center brd collapse-sm"></div>
          </div>
        </ion-scroll>
        <ion-infinite-scroll immediate-check="false" on-infinite="loadMore(query)" distance="10%"></ion-infinite-scroll>

here I am trying to use collection repeat like that

But not getting same result

can we use thin grid view ?