如何使用angularjs只检查ng-repeat复选框中的一个复选框?

时间:2015-08-06 06:29:26

标签: javascript angularjs checkbox

当我转到页面时,我需要经常检查一些软件或harware的检查框。如果选择了任何一个,那么只有提交按钮才会显示。如果没有选择提交按钮应该禁用并提醒应该来请选择一些服务

function Test1Controller($scope) {
  var storeid = window.localStorage.getItem("storeid");
  var serverData = ["software", "hardware", "Accessories"];
  $scope.items = [];

  for (var i = 0; i < serverData.length; i++) {
    var modal = {
      name: serverData[i],
      selected: i === 0 ? true : false,

    };
    $scope.items.push(modal);
  }

  $scope.check = function() {
    var checkedItems = [];
    for (var i = 0; i < $scope.items.length; i++) {
      if ($scope.items[i].selected) {
        checkedItems.push($scope.items[i].name);
      }
    }
    console.log(checkedItems);
  }


}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>

<div ng-app>
  <div ng-controller="Test1Controller">
    <div ng-repeat="item in items">
      <input type="checkbox" ng-model="item.selected" />{{item.name}}
    </div>
    <input type="button" name="submit" value="submit" ng-click="check()" />
  </div>
</div>

2 个答案:

答案 0 :(得分:1)

function Test1Controller($scope) {
  var storeid = window.localStorage.getItem("storeid");
  var serverData = ["software", "hardware", "Accessories"];
  $scope.items = [];

  for (var i = 0; i < serverData.length; i++) {
    var selectVal = false;
    if(serverData[i] === "hardware"){
        selectVal = true;
    }
    var modal = {
      name: serverData[i],
      selected: selectVal

    };
    $scope.items.push(modal);
  }
}

答案 1 :(得分:0)

你可以使用ng-if

 <div ng-repeat = "data in comments">
      <div ng-if="data.type == 'hoot' ">
          //different template with hoot data
       </div>
      <div ng-if="data.type == 'story' ">
          //different template with story data
       </div>
       <div ng-if="data.type == 'article' ">
          //different template with article data
       </div> 
   </div>