Question

我有这个要求，我需要根据某些条件禁用按钮：

控制器：

<div  ng-controller= "myController" class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"   aria-hidden="true">×</button>
                    <h3 class="modal-title"> Add</h4>

当我在html页面中添加了5个条目时，我需要禁用此按钮。有人可以帮助我吗？

Answer 1

如果您有一个项目数组，假设该数组被称为items，您可以将条件传递给ng-disabled，如果items.length >= 5，则设置为true。

<button type="button" class="close" ng-disabled="items.length >= 5" data-dismiss="modal" aria-hidden="true" >×</button>

Answer 2

当条目长度为5

时

<button ng-disabled="entries.length == 5"></button>

Answer 3

如果您的值或数组是数组，那么您可以执行以下操作

    <div  ng-controller= "myController" class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"   aria-hidden="true">×</button>
                    <h3 class="modal-title"> Add</h4>
<button ng-disabled="entries.length >= 5">ADD</button>

Answer 4

尝试使用此

    <div ng-controller="myController" class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-disabled="isButtonDisabled()">×</button>
                <h3 class="modal-title"> Add</h3>
            </div>
        </div>
    </div>

在控制器

$scope.isButtonDisabled = function() {
    return $scope.requiredArray.length >= 5;
}

此函数将检查所需数组的长度是否大于5。如果将禁用true按钮。

使用angular-js ng-disabled

4 个答案: