Question

<div>    
<table class="table">

    <tbody>
        <tr ng-repeat="student in ClassStudents | filter:stdsearch">
            <td><input type="checkbox" ng-model="student.isselected"/></td>
        </tr>
    </tbody>
</table>
<div>
 <input type="submit" ng-disabled="!student.isselected" value="Assign"  />
</div>
</div>

我只想在选中复选框时启用按钮。但这对我不起作用。请建议。

Answer 1

实际上问题是由引用ng-repeat之外的student引起的。

假设您有多名学生，并且您只希望在选择至少一名学生时启用该按钮，那么您需要循环ClassStudents并检查是否已选择其中任何一名。

<button ng-disabled="countChecked() == 0">enable/disable</button>

$scope.countChecked = function(){
    var count = 0;
    angular.forEach($scope.ClassStudents, function(value){
        if (value.isselected) count++;
    });

    return count;
}

Answer 2

在按钮中使用ng-disabled='student.isselected'。

Angular ng-disabled documentation

Answer 3

检查小提琴。选中复选框时将启用该按钮，取消选中复选框时将禁用该选项。

<div ng-controller="MyCtrl">
  Hello, {{name}}!
    <input type="checkbox" ng-model="student.isSelected"/>
    <button ng-disabled="!student.isSelected" >enable/disable</button>
</div>

//js code

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

function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.student = {isselected: false};
}

http://jsfiddle.net/HB7LU/14629/

如何在使用angularjs的表中选中Checkbox时启用/禁用按钮？

3 个答案: