2017-08-30 44 views
0

所以我有這樣的顯示待辦事項列表:如何使用離子按鈕在複選框值提交變更

<ion-item class="item-divider">To Do</ion-item> 
<ion-checkbox ng-repeat="todo in todos" ng-if="!todo.completed" 
[(ngModel)]="todo.completed"> 
<ion-label>{{todo.name}}</ion-label> 
</ion-checkbox> 

從這裏:

function ($scope, $stateParams) { 

$scope.todos = [ 
      {name:"Clean out fridge" , completed:false}, 
      {name:"Change sheets on all the beds" , completed:false}, 
      {name:"Mop Floors" , completed:false} 
      ]; 


     } 

,然後在到-Do其標記爲「已完成:真」時,進入到這個列表:

<ion-item class="item-divider"> Completed</ion-item> 
<ion-item class="item-icon-left balanced" ng-repeat="todo in todos" ng- 
if="todo.completed" [(ngModel)]="todo.completed"> 
<i class="icon ion-checkmark-circled"></i><ion-label>{{todo.name}} 
</ion-label></ion-item> 

然而,在這一點上它只能由我去到$ scope.todos和茶將完成的狀態從虛假變爲真。我試圖弄清楚如何使用離子按鈕來檢查複選框是否被選中,因此是真實的,並在點擊按鈕時將該更改提交給$ scope.todo。

回答

1

您可以嘗試使用ng-model-options,因爲您需要在表單中添加控件並使用提交類型按鈕。在形式使用NG-模型選項通過添加下面的屬性

ng-model-options="{ updateOn: 'submit' }" 

請參考以下鏈接

https://codepen.io/scottmetoyer/pen/JozErN

更新上提交模型
相關問題