Question

我有一个引导按钮，我正在使用btn btn-default但是当我使用chrome检查它在这个按钮上显示多个类时，我无法理解它为什么会发生这个问题。任何帮助将不胜感激。

main.html中

</accordion-group> <accordion-group is-open="challengeAccordion.isOpen"
    disable-control-point="CHALLENGES_VIEW"
    context-val-id="processDTO.erhUtilKeyList"
    ng-show="editMode && !CHALLENGES_VIEW"
    disable-Page-Elements="{{challengesAccordion}}"
    disablelevel="challenges">
    <div class="col-md-2">
        <div class="form-group clearfix">
            <button class="btn btn-default pull-right mousedwncall"
                require-control-point="CHALLENGES_ADD"
                context-val-id="processDTO.erhUtilKeyList"
                ng-click="addProcessChallenge()">Add Challenge</button>
        </div>
    </div>

main.js

angular.module('disablePageElements', []).directive('disablePageElements', function ($compile, $rootScope, $timeout) {
    'use strict';
       var disableButtons = function(inputs){          
                    angular.forEach(inputs, function(el){
                           el = angular.element(el);
                           var className = angular.element(el).attr('class');
                           if(angular.isUndefined(className) || !angular.isUndefined(className) && className.indexOf('ignoreDisable') === -1){
                                  var prevVal = el.attr('ng-disabled');
                                  prevVal = prevVal? prevVal +  ' || true': 'true';                           
                                  el.attr('ng-disabled', prevVal);

                                  var classPrevVal = el.attr('class');
                                  if(classPrevVal.indexOf('disableSaveCls') === -1){
                                      classPrevVal = classPrevVal ? classPrevVal +  ' btn btn-primary disableSaveCls': ' btn btn-primary disableSaveCls';
                                  }
                                  el.attr('class', classPrevVal);

                                  $compile(el)(scope);
                           }                                 
                    });
                };
});

chromeInspectElement代码

<button class="btn btn-default pull-right mousedwncall btn btn-primary disableSaveCls ng-scope" require-control-point="CHALLENGES_ADD" context-val-id="processDTO.erhUtilKeyList" ng-click="addProcessChallenge()" ng-disabled="true || true || true || true" disabled="disabled">Add Challenge</button>

Answer 1

你可能有一个添加额外风格的指令。

试试这个

<div class="col-md-2">
    <div class="form-group clearfix">
        <button class="btn btn-default pull-right"
            ng-click="addProcessChallenge()">Add Challenge</button>
    </div>
</div>

Answer 2

可能还有其他外部CSS文件为您的按钮添加了样式。

例如，ng-scope是AngularJS的一部分

检查时Bootstrap按钮类重复，我该如何解决这个问题？

2 个答案: