默認選中的複選框未顯示在結果中

我在默認選中項目時遇到問題。默認複選框正在工作，但是當我按下一個按鈕來顯示所有選中的項目時，默認檢查並未顯示（它們顯示爲未選中狀態），但是如果我取消選中它並再次檢查它，那麼它就可以工作。我無法找到問題，這是我的代碼：默認選中的複選框未顯示在結果中

<ion-checkbox value="{{godina['title']}}" style="width: 200px;margin: 0 auto;" ng-model="checkItems[godina['title']]" ng-click="print()" ng-checked="godina.checked" ng-repeat="godina in godine">{{godina["title"]}}</ion-checkbox>

JS：

$scope.godine = [ 
        { id: 'Duh', title: '0',checked : false }, 
        { id: 'Duh2', title: '1',checked : false }, 
        { id: 'Duh3', title: '2',checked : true}, 
      ]

這是JS的所有檢查項目：

var array = []; 
for (i in $scope.checkItems) { 
    alert($scope.checkItems[i]); 
    if ($scope.checkItems[i] == true) { 
     array.push(i); 
    } 
}

什麼我我做錯了？

來源

2017-07-03 fvukovic

你可以發佈代碼按鈕點擊和相應的JS？ – Vivz

你並不需要一個ng-model跟蹤複選框的值。你可以做的是，通過傳遞整個對象作爲ng-click的函數參數，然後檢查是否已經選擇了該對象，只需跟蹤ng-click事件上的選定複選框。如果沒有選擇對象（複選框），則在選中的複選框數組上按下此對象。但是如果已經選擇了它，只需從選定的數組中刪除它。這裏是工作正常

<ion-checkbox type='checkbox' value="{{godina['title']}}" ng-click="print(godina)" ng-checked="godina.checked" ng-repeat="godina in godine">{{godina["title"]}}</ion-checkbox>

控制器代碼

$scope.checkItems = []; 
    $scope.godine = [ 
     { id: 'Duh', title: '0',checked : false }, 
     { id: 'Duh2', title: '1',checked : false }, 
     { id: 'Duh3', title: '2',checked : true}, 
    ]; 
    angular.forEach($scope.godine, function(value, key){ 
     if(value.checked){ 
     $scope.checkItems.push(value); 
     } 
    }); 


    $scope.print = function(godina){ 
    var idx = $scope.checkItems.indexOf(godina); 

    // Is currently selected 
    if (idx > -1) { 
     $scope.checkItems.splice(idx, 1); 
    } 

    // Is newly selected 
    else { 
     $scope.checkItems.push(godina); 
    } 
    console.log($scope.checkItems); 
    }

注意，循環的代碼。它用於推動選擇陣列中的已選對象$scope.checkItems

爲了您的簡單。這裏是鏈接到JSFIDDLE

來源

2017-07-03 10:38:27

謝謝，但結果是一樣的。當我打開頁面時，會檢查默認項目。但如果我沒有按任何東西，並且如果我按保存選中的項目，結果將是一個空白數組。 – fvukovic

不，它不會是空白數組。點擊保存時，檢查該函數內的$ scope.checkItems的值。您將獲取在加載頁面時選擇的默認值的對象。檢查這個jsfiddle http://jsfiddle.net/j0bfe16q/。打開瀏覽器控制檯並查看。你會在那裏看到默認值。 –

哦，它的工作原理！謝謝你，我是新的角度，當我失去2-3小時這樣的事情..uf ..再次感謝你：D – fvukovic

變化NG-模型值和刪除NG-檢查

<ion-checkbox value="{{godina['title']}}" style="width: 200px;margin: 0 auto;" 
ng-model="godina.checked" ng-click="print()" ng-repeat="godina in godine"> 
{{godina["title"]}}</ion-checkbox>

來源

2017-07-03 10:31:11 Veera

默認選中的複選框未顯示在結果中

回答

相關問題