Javascript 离子点火器卡2-卡阵列中的卡太多会破坏卡堆栈视图

目前我正在一个项目中使用Ionic Tinder Cards 2。这是它的Github页面：

我遇到的问题是：当我向活动卡片数组（应该在HTML视图中显示的卡片数组）添加过多卡片时，卡片堆栈将中断。我制作了一个代码笔，希望能更好地解释这一点：

如果你，在这个代码笔中，稍微拖动堆栈中的第一张卡，你就会明白我的意思。这就好像，当堆栈变得太长时，它将开始在底部得到mirroed

我不确定爱奥尼亚插件中的代码是什么导致了这个问题，但我试图通过仅显示整个阵列的子集来解决这个问题。也就是说，我不想加载我所有的30张图片，我只想一次显示其中的10张。我试着这样做：

<div ng-if="cards.active">
<td-cards>
    <td-card ng-repeat="card in cards.active|limitTo:9" on-destroy="cardDestroyed($index)" on-swipe-left="cardSwipedLeft($index)" on-swipe-right="cardSwipedRight($index)">
        <div class="image">

            <div class="no-text"><i class="icon_close_alt2"></i></div>
            <div class="yes-text"><i class="icon_circle-empty"></i></div>

            <img ng-src="{{ card.image }}">
        </div>
    </td-card>
    <td-card id="end-card" drag="false">
        <i class="icon ion-ios-close"></i>
    </td-card>
</td-cards>

我只需将一组图像文件路径加载到该阵列，并将其链接到“活动”卡阵列。我知道这部分有用

接下来的问题是，我将如何解决此镜像问题，以便即使使用大型阵列，卡堆栈也将继续淡入背景，或者如何在整个阵列中一次仅显示一个子集

谢谢大家的帮助：）

var poemCardStack = JSON.parse(window.localStorage.getItem("unlikedPoems"));

$scope.cards = {
master: Array.prototype.slice.call(poemCardStack, 0),
active: Array.prototype.slice.call(poemCardStack, 0),
discards: [],
liked: [],
disliked: []
}