在Angularjs的控制器上启用/禁用按钮

Enable/Disable button from controller on Angularjs

本文关键字：按钮 启用 Angularjs 控制器      更新时间：2023-09-26

我有一个HTML按钮选项如下，

<button ng-class="{'primaryButton':true}" type="button" id="modalCreateBtn" "ng-hide="false" class="btn btn-group mm-btn-save primaryButton" ng-click="addSegments()">CREATE</button>

上述按钮选项中没有ng-disable选项。是否可以在控制器上启用/禁用按钮buttonId ?另外，我不想在HTML视图上添加禁用选项。相反，我想通过脚本控制它。这可能吗?

你看过ngDisable吗?你可以有一个ngModel，并在控制器中修改它。就像这里的文档示例所说的:

<span  ng-controller="MyController as myController">
  <label>Click me to toggle: <input type="checkbox" ng-model="myController.checked"></label><br/>
  <button ng-model="button" ng-disabled="myController.checked">Button</button>
</span>

和JS:

angular.module('controllerAsExample', [])
  .controller('MyController ', function(){
      this.checked = false;
 //   this.checked = true;
  });

使用ng-disabled是启用/禁用按钮的最佳实践，但您也可以在控制器中实现它，而无需使用此脚本在HTML视图中添加disabled属性，

angular.element(document.getElementById('yourButtonId'))[0].disabled = true;

对你来说，

angular.element(document.getElementById('modalCreateBtn'))[0].disabled = true;

砰砰作响

希望这对你有帮助!

您试过使用ng-if吗?

控制器:

$scope.setUploadMode = function (stats) {
    if (stats == 4) {
        $scope.selectMe = false;
    } else { alert("No"); $scope.selectMe = true;  }
};
$scope.hello = function () {
    alert("YEY");
};

HTML: 

div class="radio">
<label>
    <input type="radio" name="appendCreateMode" ng-disabled="uploadMode != 2" ng-click="setUploadMode(4)" />Append Folder
</label>
</div>
<button ng-model="button" ng-disabled="selectMe" ng-click="hello()">Button</button
相关文章：