2015-12-15 102 views
0

我有一个情况,有3个复选框(“最初选中”)。因为它作为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},  
]; 

在每个复选框中点击ng,我称之为函数测试(“apple”)。我对着

$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> 
+0

你是怎么想precisly办? – AlainIb

回答

2

不太清楚你的问题,但希望我的回答可以给你一些提示。

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="[email protected]" 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>

0

当且仅当你想把一个数组检查谁的项目:

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

}