1. 程式人生 > >angularjs radio、checkbox、ng-repeat

angularjs radio、checkbox、ng-repeat

radio使用ng-repeat如何預設選中:

html:
<div class="excels">
   <label ng-repeat="y in mytypeData">
      <input type="radio" ng-model="mytype.value" name="myname" ng-value="y.name"/><span ng-bind="y.name"></span>
   </label>
</div>
js:
$scope.mytype = {value: 'excel'};
$scope.mytypeData 
= [{ "name": "excel", "checked": true }, { "name": "csv", "checked": false }, { "name": "json", "checked": false }, { "name": "txt", "checked": false } ];
chceckbox使用ng-repeat,可根據標題切換相應內容,並過濾篩選條件
<div class="dataNavUl">
   <div ng-repeat="x in myExportData" ng-class=
"{'dataChoice':$parent.dataChoice==$index}" ng-click="$parent.dataChoice=$index"> <span ng-bind="x.name"></span> </div> </div> <div class="setting_check" ng-repeat="x in myExportData" ng-show="$parent.dataChoice==$index"> <div class="form-group"> <
label class="control-label" for="checkboxes">必選:</label> <div> <button class="but1" ng-disabled="true" ng-repeat="k in x.items | filter:{'required':true}"> <span ng-bind="k.header"></span> </button> </div> </div> <div class="form-group"> <label class="control-label" for="checkboxes">可選:</label> <div> <button class="but2" ng-model="k.checked" ng-class="{'checked':k.checked}" ng-repeat="k in x.items | filter:{'required':false}" ng-click="k.checked=!k.checked;"> <span ng-bind="k.header"></span> </button> </div> </div> </div>
js1:
$scope.myExportData=data;
js2:
var uploadData = [];
for (var i = 0; i < $scope.myExportData.length; i++) {
    for (var j = 0; j < $scope.myExportData[i].items.length; j++) {//每個items[i]是一個ss
if ($scope.myExportData[i].items[j].checked) {
            uploadData.push($scope.myExportData[i].items[j].name);
        }
        if ($scope.myExportData[i].items[j].required) {
            uploadData.push($scope.myExportData[i].items[j].name);
        }
    }
}