使用 AngularJS 引导：使用 btn-xs（或 btn-sm）不显着 ng-disabled答案

【问题标题】：Bootstrap with AngularJS: ng-disabled is not noticable with btn-xs (or btn-sm)使用 AngularJS 引导：使用 btn-xs（或 btn-sm）不显着 ng-disabled
【发布时间】：2015-10-19 18:10:05
【问题描述】：

请考虑以下Plunk。

我正在使用这个控制器：

app.controller('myController', [
      '$scope',
      function($scope){

        $scope.isDisabled = true;

        $scope.ClickMe = function(text) {
          alert(text);
        };
}]);

还有这个 HTML：

<body ng-app="ngApp">
    <div ng-controller="myController">
      <p>
        Is disabled:
        <input type="checkbox" ng-model="isDisabled"/>
      </p>
      <p>
        <button class="btn btn-primary" ng-disabled="isDisabled" ng-click="ClickMe('Save')">Save</button>
        <button class="btn btn-danger" ng-disabled="isDisabled" ng-click="ClickMe('Cancel')">Cancel</button>
      </p>
      <p>
        <button class="btn-xs btn-primary" ng-disabled="isDisabled" ng-click="ClickMe('Save')">Save</button>
        <button class="btn-xs btn-danger" ng-disabled="isDisabled" ng-click="ClickMe('Cancel')">Cancel</button>
      </p>
    </div>
</body>

问题

您可以注意到，btn-xs 样式的按钮的禁用/启用状态之间没有明显的区别。普通的btn按钮很好。

但实际状态本身确实有效，因为禁用时您无法单击按钮。

是我做错了什么还是 btn-xs btn-sm 是这样工作的？有没有一种简单的方法可以以用户可见的方式切换禁用状态？

也许是基于 btn-xs 的自定义类？

谢谢！

【问题讨论】：

标签： javascript css angularjs twitter-bootstrap

【解决方案1】：

你忘了给小按钮指定 'btn' 类。

【讨论】：

不知道你还得用btn，我还以为是btn-xs而不是btn。谢谢！