如何根据angularjs中的数据自动选择复选框？

在我的web应用程序中存在复选框列表。我需要的是，从后台获取数据存在的列表，基于这些数据我想自动检查复选框。如果它混淆下面是我的代码。如何根据angularjs中的数据自动选择复选框？

HTML

<span ng-repeat="days in selectDays"> 
     <input type="checkbox" id="{{days}}" ng-model="selectedList[days]" value="{{days | uppercase}}"/> 
     <label for="{{days}}">{{days}}</label> 
    </span>

控制器

 $scope.selectDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];

从后端我得到以下数据正在响应

["SUN", "MON"];

下面我分享我的网页快照。

我的需求是检查响应数据与$scope.selectDays如果存在，那么我必须检查各自的复选框。即如果列表中有“SUN”，那么我必须检查它。

来源

2016-12-09 Kishan

根据我的理解提供答案，让我知道任何你需要的东西！ –

看看它：

<html> 

<head> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script> 

</head> 

<body ng-app="myApp" ng-controller="myCtrl"> 

<div id="wrapper" ng-repeat="x in dayList"> 

<input type="checkbox" ng-checked="findIt(x.name)">{{x.name}} 

</div> 

<script> 
//module declaration 
var app = angular.module('myApp',[]); 

//controller declaration 
app.controller('myCtrl',function($scope){ 
    $scope.dayList = [{name:'Sun'}, {name:'Mon'}, {name:'Tue'}, {name:'Wed'}, {name:'Thu'}, {name:'Fri'}, {name:'Sat'}]; 
    $scope.marked = ['Sun','Wed']; 

$scope.findIt = function(item){ 
    if($scope.marked.indexOf(item)!= -1){return true;} 
} 


}); 

</script> 

</body> 

</html>

结果：

希望，这有助于！

来源

2016-12-09 07:59:11 Deadpool

您可以使用ng-checked

<span ng-repeat="days in selectDays"> 
    <input type="checkbox" ng-checked="response.indexOf(days) !== -1" id="{{days}}" ng-model="selectedList[days]" value="{{days | uppercase}}"/> 
    <label for="{{days}}">{{days}}</label> 
</span>

DEMO

来源

2016-12-09 08:01:58

KISS！好的解决方案 – lin

HTML

<div ng-controller="MyCtrl"> 
    <span ng-repeat="days in selectDays"> 
     <input type="checkbox" id="{{days.Day}}" value="{{days.Day | uppercase}}" ng-checked="days.IsCheck"/> 
     <label for="{{days.Day}}">{{days.Day}}</label> 
    </span> 
</div>

var myApp = angular.module('myApp',[]); 

//myApp.directive('myDirective', function() {}); 
//myApp.factory('myService', function() {}); 

function MyCtrl($scope, $filter) { 
    $scope.selected = ['Sun', 'Wed'] 
    $scope.selectDays = [{"Day" : 'Sun',"IsCheck" : false}, 
    {"Day" : 'Mon',"IsCheck" : false}, {"Day" : 'Tue',"IsCheck" : false}, 
    {"Day" : 'Wed',"IsCheck" : false}] 

    angular.forEach($scope.selected,function(obj,i){ 

      var obj = $filter('filter')($scope.selectDays, { Day: obj })[0]; 
     if(obj != null) 
     { 
      obj.IsCheck = true; 
     } 
    }) 
}

请找的jsfiddle链接以及

Demo

来源

2016-12-09 08:20:16

如何根据angularjs中的数据自动选择复选框？

回答

相关问题