结果中未显示默认选中的复选框

时间:2017-07-03 10:20:40

标签: angularjs ionic-framework

我的默认选中项目有问题。默认复选框正常工作,但是当我按下按钮显示所有选中的项目时,默认检查未显示(它们显示为未选中),但是如果我取消选中它并再次检查,则可以正常工作。我无法找到问题,这是我的代码:

<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);
     }
 }

我做错了什么?

2 个答案:

答案 0 :(得分:1)

您不需要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

中推送已选择的对象

为了您的简单。以下是GridView.OptionsClipboard

的链接

答案 1 :(得分:0)

更改ng-模型值并删除ng-checked

document