從列表中刪除項目Ionic

我正在構建一個離子的列表應用程序。我正在做一個刪除功能，點擊刪除按鈕，它會刪除列表項，但我遇到問題並無法弄清楚。刪除按鈕顯示，但是當你點擊它時沒有任何反應。從列表中刪除項目Ionic

HTML：

<ion-view view-title="To-Do"> 
    <ion-content class="padding"> 



    <!-- http://ionicframework.com/docs/components/#bar-inputs --> 
    <div class="bar bar-header item-input-inset"> 
     <label class="item-input-wrapper"> 
     <i class="icon placeholder-icon"></i> 
     <input type="text" ng-model="item.name" placeholder="Enter Task Here"> 
     </label> 
     <button class="button ion-ios-plus-outline" ng-click="addItem(item)"> 

     </button> 
    </div> 

    <ion-list> 
     <ion-item class="item-remove-animate" ng-repeat="item in items" > 
     <h3>{{item.name}}</h3> 
     <ion-option-button class="button-assertive ion-trash-a" ng-click="remove($index)"></ion-option-button> 
     </ion-item> 
    </ion-list> 


    </ion-content> 
</ion-view>

控制器：

.controller('ShortTermCtrl', function($scope, Task) { 

    $scope.data = Task.data; 


    $scope.items = []; 
    $scope.item = {}; 

    $scope.addItem = function (item) { 
    $scope.items.push(item); 
    $scope.item = {name: ""}; 

    }; 

    $scope.removeItem = function(index){ 
    $scope.items.splice(index, 1); 
    }; 


})

來源

2016-04-24 Andrew Irwin

更改函數名'removeItem'：從remove到removeItem改變它。 – alexmac

非常感謝！這工作，問題是，我一直在看代碼很久，我只是沒有看到它！謝謝 –

是否要將您的評論更改爲答案，以便我可以將其標記爲已解決/爲其他人查看答案？ –

您在視圖中使用錯誤的函數名稱。從`remove`

<ion-option-button class="button-assertive ion-trash-a" ng-click="removeItem($index)"></ion-option-button>

來源

2016-04-24 12:03:38 alexmac

我得到了我的代碼添加和刪除功能在這裏：http://chat.stackoverflow.com/rooms/88039/discussion-between-mudasser-ajaz-and-rredcat和@Alexander人指出我的錯誤，我有在html文件中將我的函數命名錯誤。謝謝。 –

爲NG-重複使用

ng-repeat='(index, item) in items'

保持每個項目的指數跟蹤，並通過指數的刪除功能

ng-click="removeItem({{index}})"

來源

2016-04-24 11:56:12

根據您的codexample，你註釋掉刪除（任務）功能，你需要瞄準的removeItem（指數）函數在HTML

而不是一個靜態的指標數，提供的項目/指數本身到一個通用的功能，然後刪除數組項，像這樣：

$scope.removeItem = function(items, index){ 
    items.splice(index, 1); 
};

你的HTML看起來像這樣：

<ion-option-button class="button-assertive ion-trash-a" ng-click="removeItem(items, $index)">

$ index會自動暴露給您的ng-repeat範圍以及其他有用的屬性，您可以在ng-repeat的文檔中閱讀更多信息：https://docs.angularjs.org/api/ng/directive/ngRepeat

來源

2016-04-24 11:58:22 risuch

從列表中刪除項目Ionic

回答

相關問題