2016-04-19 34 views
1

當我們向左滑動列表時,我有一個數據列表,其中列出了帶有刪除功能的離子列表。離子列表中的拼接方法,列表刷新,但仍然顯示刪除按鈕

我可以使刪除功能工作,但是在成功響應和列表刷新後,刪除按鈕仍然顯示在我們之前點擊的索引中。

我使用$scope.data.splice($index, 1);

這是我的代碼

HTML

<ion-pane> 
    <ion-view view-title="Incoming list"> 
    <ion-nav-buttons side="right"> 
     <a class="button" href="#/app/fg-in-add"> 
     <i class="icon ion-plus"></i> 
     </a> 
     <a class="button" href="#/app/scanner-fg-in"> 
     <i class="icon ion-qr-scanner"></i> 
     </a> 
    </ion-nav-buttons> 

    <ion-content class="has-header"> 
     <div class="list"> 
     <div class="item item-input-inset"> 
      <label class="item-input-wrapper"> 
      <i class="icon ion-search placeholder-icon"></i> 
      <input type="text" ng-model="fgin.search" class="textUppercase"> 
      </label> 
      <button class="button button-small"> 
      <i class="icon ion-search"></i> Search 
      </button> 
     </div> 
     </div> 
     <ion-list show-delete="false" can-swipe="true"> 
     <ion-item ng-repeat="x in data track by $index" class="item-remove-animate"> 
      <!-- <ion-option-button class="button-positive icon ion-edit" on-touch="deleteFGin({{x.mif_no}})"></ion-option-button> --> 
      <ion-option-button class="button-assertive icon ion-trash-a" on-touch="Delete(x.mif_no,x.item_no,$index); x.deleted = true;"></ion-option-button> 
      <h3><i class="icon ion-android-apps"></i> {{x.mif_no}} <i class="icon ion-ios-arrow-thin-right"></i> {{x.item_no}}</h3> 
      <hr /> 
      <div class="descr"><i class="icon ion-grid"></i> <span class="judul">{{x.part_no}}</span> <i class="icon ion-ios-arrow-thin-right"></i> {{x.part_name}}</div> 
      <div class="descr indentlitte">{{x.qty}} {{x.u_measure}}<i class="icon ion-ios-arrow-thin-right"></i> {{x.rack_no}}</div> 
      <span class="badge badge-clear">{{x.date}}</span> 
     </ion-item> 
     </ion-list> 
    </ion-content> 

    </ion-view> 
</ion-pane> 

JS

$scope.Delete = function(docno,itemno,index){ 
    $http({ 
    method: "post", 
    url: apiServer + "/fg-in-del.php", 
    data: { 
     mifno: docno, 
     itemno: itemno, 
     Dbserver: window.localStorage.getItem("server"), 
     Dbuser: window.localStorage.getItem("username"), 
     Dbpass: window.localStorage.getItem("password"), 
     Dbname: window.localStorage.getItem("dbname"), 
    }, 
    headers: { 
     'Content-Type': 'application/x-www-form-urlencoded', 
    } 
    }).then(function(response) { 
    if (response.data == 1){ 
     var alertPopup = $ionicPopup.alert({ 
     title: 'Delete', 
     template: 'Data has been deleted.' 
     }); 
     $scope.data.splice(index, 1); 
    }else { 
     var alertPopup = $ionicPopup.alert({ 
     title: 'Delete', 
     template: 'Failed to delete data.' 
     }); 
     console.log(response.data); 
    } 
    }, function(response) { 
    $scope.data=response.data; 
    var alertPopup = $ionicPopup.alert({ 
     title: 'Delete', 
     template: 'Failed to delete data.' 
    }); 
    }); 
} 

回答

1

這是太奇怪了,因爲我發現昨晚我的應用程序完全一樣,我認爲這可能是一個錯誤。 我選擇從服務器刷新整個列表,但如果這不是您的選擇,您可以在控制器中注入$ionicListDelegate,並在拼接後調用$ionicListDelegate.closeOptionButtons()

+0

刷新整個列表對我來說不是一個選項,會在性能上造成一些問題。但'$ ionicListDelegate.closeOptionButtons()'解決了我的問題,沒有注意到任何副作用。 –

+0

太棒了,很高興它的工作 –