I have a list of cards which works perfect with ng-repeat, but when I substitute ng-repeat with collection-repeat, it breaks and instead of showing each item in the list it shows none. In the scope, cards
is initialized properly, but for card in cards
, when I check if it’s finding each card
by doing {{card}}
there’s nothing there. I am fairly new to ionic, so I’m not quite sure where to begin debugging it. Any ideas on what’s going on here?
<ion-content>
<ion-list>
<ion-item
collection-repeat="card in cards"
collection-item-width="'100%'"
collection-item-height="120"
ng-href=""
href = "">
<div ng-style="{'background-image':'url({{card.card.images[0]}})'}" ng- click="openDetail(card)" style="cursor:pointer;" ></div>
<h4 class="likes-title" ng-click="openDetail(card)" style="cursor:pointer;">{{card.title}}</h4>
<div class="actions">
<button ng-click="buy(card)" class="button button-balanced"><i class="icon ion-ios7-cart"></i> Buy</button>
<button class="button button-assertive" ng-click="removeCard(card)"><i class="icon ion-trash-a"></i> Remove</button>
</div>
</ion-item>
</ion-list>
<ion-infinite-scroll
ng-if="moreDataCanBeLoaded()"
icon="ion-loading-c"
on-infinite="loadMore()"
distance="5%">
</ion-infinite-scroll>
</ion-content>