Question

我有一个角度应用，我按如下方式定义了一个表：

<tr ng-repeat="child in requirements">
    {% verbatim %}
    <td class="vcenter"><input type="checkbox" ng-checked="selectedCourses.indexOf(child) != -1" ng-click="toggleCheck(child)" ng-disabled="required == (planned + completed)" value=""/>
        {{child.course.subject}}-{{child.course.course_no}}
    </td>
    <td class="vcenter">{{child.course.course_name}}</td>
    {% endverbatim %}
    <td class="vcenter">3</td> 
</tr>

在app.js（控制器）中，我定义了以下函数，以便在满足上述条件后，切换将自行禁用。

$scope.toggleCheck = function (course) {
    if (($scope.selectedCourses.indexOf(course) === -1)) {
        $scope.selectedCourses.push(course);
        $scope.planned += 3;
        if (($scope.planned + $scope.completed) == $scope.required) {
            alert('Requirement met');
        }
        } else {
            $scope.selectedCourses.splice($scope.selectedCourses.indexOf(course), 1);
            $scope.planned -= 3;
        }
    $scope.getPercentage();
};

到目前为止，一切都很好，一旦条件满足，表格就会禁用切换。但是当禁用时，表格甚至会禁用已检查的切换，这是有道理的。我如何确保禁用只发生在未经检查的切换而不是已检查的切换？

Answer 1

你需要检查ng-checked是否也是真的。

<td class="vcenter">
    <input type="checkbox"
        ng-checked="selectedCourses.indexOf(child) != -1"
        ng-click="toggleCheck(child)"
        ng-disabled="required == (planned + completed) && selectedCourses.indexOf(child) == -1"
        value=""
    />
/>

只有在满足上一个条件和时才会禁用它。

角度表禁用在满足条件时切换

1 个答案: