Angular Material 按钮禁用样式更改

Question

form.html

<md-button class="md-raised md-primary pull-right formPage" ng-disabled="formPage.$invalid" ng-click ="submit()">SAVE</md-button>

css

.md-button.md-raised.md-primary.formPage {
    position: right !important;
    color: #FFFFFF;
    background-color:#008cba;    
}

按钮已禁用，但它具有我 css 的自定义颜色。我如何显示默认的禁用样式或者如果它被禁用则更改按钮颜色？

Jsfiddle

Answer 1

当按钮被禁用时，一个新的 class 出现在您的按钮上，名称类似于 disabled。检查并更新您的 css，如下所示。

.md-button.md-raised.md-primary.formPage:not(.disabledclassname) {
    position: right !important;
    color: #FFFFFF;
    background-color:#008cba;    
}

Answer 2

css应该是

.md-button.md-raised.md-primary.formPage:not([disabled])

见http://jsfiddle.net/apxbutmf/

Answer 3

覆盖以下 css class 对我有用（Angular-Material v12 按钮 mat-stroked）：

.mat-stroked-button.mat-button-disabled.mat-button-disabled {    

color: #FFFFFF;
background-color: #008cba

}