Question

我的情况是有3个复选框（＆＃34;最初检查＆＃34;）。由于它是3复选框，它将使用ng-repeat 3次并循环除法。现在，一旦我取消选中任何一个复选框，它应该显示div 2次。到目前为止，

$scope.items = [
    {id: 0, title: "apple",selected:true},
    {id: 1, title: "orange",selected:true},
    {id: 2, title: "grapes",selected:true},     
];

在每个复选框中点击 - 我已经调用了一个功能测试（＆＃34; apple＆＃34;）。

$scope.test = function(vals) {
    $scope.vl=[];
    for(var i=0;i<$scope.items.length;i++) {
        if($scope.items[i].title == vals) {
            console.log("dnt push");
        }
        else {
            $scope.vl.push({
                id: $scope.items[i].id,
                title: $scope.items[i].title,
                selected:true                      
            });
        }
    } 
    console.log("vl array");
    console.log($scope.vl);
}

我遇到的问题是第1次取消检查时效果正常，但是当我进行多次取消检查时却没有。当我检查未选中时它没有加载div。

在HTML中，我使用的是，

<div ng-repeat="item in vl"> some tags </div>

Answer 1

对你的问题不太确定，但希望我的答案可以给你一些提示。

plunker demo

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.items = [{
    id: 0,
    title: "apple",
    selected: true
  }, {
    id: 1,
    title: "orange",
    selected: true
  }, {
    id: 2,
    title: "grapes",
    selected: true
  }];
});

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>
  <div ng-repeat="item in items">
    <input type="checkbox" ng-model="item.selected">{{item.title}}
  </div>
  {{items | json}}
</body>

</html>

Answer 2

当且仅当您要将已检查的项目放入数组时：

http://plnkr.co/edit/DvoPBBvKf3AhYM4qcBhx?p=preview

<强> HTML

<div ng-repeat="item in items">
  <input type="checkbox" 
        ng-model="item.selected" ng-click="test(item.title)"> {{item.title}}
</div>

<强>控制器

$scope.test = function(vals) {
  $scope.vl=[];
  $scope.vlChecked=[];
  for(var i=0;i<$scope.items.length;i++) {
    if($scope.items[i].selected) {
      $scope.vlChecked.push({
        id: $scope.items[i].id,
        title: $scope.items[i].title,
        selected:true                    
      });
    }
  } 

  console.log("vlChecked array");
  console.log(JSON.stringify($scope.vlChecked));

}

根据复选框获取数组值

2 个答案: