お世話になります。開発環境Monacaです。Monaca公式ガイドブックサンプル「バーコードスキャナー
アプリ（https://ja.monaca.io/book/zip/10-2.zip）」を編集しています。こちらのアプリの履歴画面に、左スワイプで各アイテムごとに削除する機能を実装しました。しかし試してみたところ、下記のような問題が発生しました。

＜問題の詳細＞
A、B、Cの3つのアイテムがある場合、Bを左スワイプし削除すると、同時にCも左スワイプされた状態（削除ボタンが見えたまま）で表示されてしまいます。

＜目標＞
Bが削除されても、AとCは普通の状態（削除ボタンが見えない）で表示したいです。

＜試してみたこと＞
・ng-repeatのtrack by $indexを削除
→上記の問題は発生しませんでした。しかしtrack by $indexは必要な機能のため、こちらは削除せずに解決したいです。

・削除ボタンの処理内で、ons-carousel-itemのindexをsetActiveCarouselItemIndexで指定する
→画面上変化なし

アドバイスを頂ければ幸いです。

index.html

            <!DOCTYPE HTML>
            <html>
            <head>
                <meta charset="utf-8">
                <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
                <script src="components/loader.js"></script>
                <link rel="stylesheet" href="components/loader.css">
                <link rel="stylesheet" href="css/style.css">
                <script>
                    var module = ons.bootstrap();
                    ons.disableAutoStatusBarFill();  // (Monaca enables StatusBar plugin by default)
                </script>
                <script src="app.js"></script>
            </head>
            <body ng-controller="AppController">

                <ons-tabbar>
                    <ons-tab page="scanner.html" active="true" icon="fa-barcode" label="スキャナ" no-reload></ons-tab>
                    <ons-tab page="history.html" icon="fa-list" label="履歴" no-reload></ons-tab>
                </ons-tabbar>

                <ons-template id="scanner.html">
                    <ons-navigator var="navi">
                        <ons-page>
                            <ons-toolbar>
                                <div class="center">スキャン開始</div>
                            </ons-toolbar>
                            <div class="scanner-wrapper">
                                <p class="scanner-label">商品のバーコードをスキャンして、その商品の詳細情報を見てみましょう</p>
                                <div class="scanner-eye-catch">
                                    <ons-icon icon="fa-barcode" size="160px"></ons-icon>
                                </div>
                                <ons-button class="scanner-button" modifier="large--cta" ng-click="scan()">スキャンする</ons-button>
                            </div>
                        </ons-page>
                    </ons-navigator>
                </ons-template>

                <ons-template id="loading.html">
                    <ons-alert-dialog>
                        <div class="alert-dialog-title">処理中...</div>
                        <div class="alert-dialog-content">
                            <ons-icon icon="ion-load-c" spin="true"></ons-icon> <span style="font-size: 13px; color: #999">商品情報を検索しています...</span>
                        </div>
                    </ons-alert-dialog>
                </ons-template>

                <ons-template id="history.html">
                    <ons-navigator var="navi">
                        <ons-page>
                            <ons-toolbar>
                                <div class="center">スキャン履歴</div>
                                <div class="right"><ons-toolbar-button ng-click="clearHistory()">クリア</ons-toolbar-button></div>
                            </ons-toolbar>                

                            <ons-list>
                                <ons-list-item ng-repeat="product in history track by $index" 
                                    class="item-wrapper" >

                                    <ons-carousel swipeable style="height: 150px; width: 100%;" initial-index="0" auto-scroll　var="myCarousel">

                                        <ons-carousel-item class="list-action-menu">      
                                            <div class="item-title">{{product.name}}</div>                                
                                            <ons-row>
                                                <ons-col width="90px">
                                                    <img ng-src="{{product.thumbnailUrl}}" class="item-image">
                                                </ons-col>
                                                <ons-col>
                                                    <div class="item-desc">
                                                        {{product.desc}}
                                                    </div>
                                                    <div class="item-price">
                                                        <span class="item-price-digit">{{product.price}}</span> <span class="item-price-unit">円</span>
                                                    </div>
                                                </ons-col>
                                            </ons-row>
                                        </ons-carousel-item>

                                        <ons-carousel-item class="list-action-item">
                                            <ons-button ng-click="swipeDelete($index)">
                                            Remove
                                            <ons-icon icon="ion-trash-a">
                                            </ons-button>
                                        </ons-carousel-item>                        

                                    </ons-carousel>

                                </ons-list-item>                    
                            </ons-list>
                            <div ng-show="history.length === 0" class="empty-history">
                                履歴がありません
                            </div>
                        </ons-page>
                    </ons-navigator>
                </ons-template>

            </body>
            </html>

app.js(追加)

    $scope.swipeDelete = function(i){
    　$scope.history.splice(i, 1);
    　myCarousel.setActiveCarouselItemIndex(0);
　　}　

画像の説明をここに入力