如何在AngularJs的$mdDialog中更改样式或添加CSS？

我使用了下面的代码来显示对话框，但我想更改对话框的默认样式

这是我的密码：

$scope.LocationRejectModal=函数（msg）{
var PersonName=msg.from.local；
var confirm=$mdDialog.confirm（）
.title（“位置”）
.textContent（PersonName+“已拒绝位置共享请求”。）
.targetEvent（事件）
.ok（‘ok’）
$mdDialog.show（confirm）.then（function（）{
//一些代码
}，函数（）{
//一些代码
});
};

---

如何做到这一点？

您不能将自定义样式应用于预定义的对话框，例如

警报

和

确认

。如果必须使用自定义css规则，则必须实现

自定义对话框

或

预渲染对话框

。在第一种方式中，仅当必须呈现对话框内容时（例如，当您打开对话框本身时），才会呈现对话框内容。第二种方式（使用预渲染对话框）是将对话框的内容与页面一起渲染。默认情况下，它将隐藏，并且仅当按下按钮时才显示它

在这两种情况下，您可以在需要的地方轻松地应用自定义css规则

---

在中，您可以找到更多信息。

我有一个类似的情况，我想添加自定义按钮样式，而不是默认按钮样式，因为很难看到

this.$rootScope.isErrorDialogOpen=true；
var confirm=this.$mdDialog.confirm({
onComplete:函数afterShowAnimation（）{
var$dialog=angular.element（document.querySelector（'md-dialog'）；
var$actionsSection=$dialog.find（'md-dialog-actions'）；
var$cancelButton=$actionsSection.children（）[0]；
var$confirButton=$actionsSection.children（）[1]；
元素（$confirButton）.addClass（'md-radised-md-accent'）；
angular.element（$cancelButton）.addClass（'md-raised'）；
}
})
.title（'会话超时'）
.textContent（'您想继续登录应用程序吗？'）
.好（‘是’）
.取消（“否”）；
此.mdDialog.show（确认）。然后（（）=>{
//你的密码在这里
}, () => {
//你的密码在这里
}

您还可以为

md对话框操作按钮添加一个属性，以获得独特的样式，如下所示

    function showConfirmDialogBox(evt) {
       var confirm = $mdDialog.confirm({
           onComplete: function runAfterAnimation() {
                var mdDialogActions = angular.element(document.getElementsByTagName('md-dialog-actions').children();
                angular.element(mdDialogActions[0]).attr('id', 'customConcelButton'); // for the md-cancel-button
                angular.element(mdDialogActions[1]).attr('id', 'customConfirmButton'); // for the md-confirm-button
           }
    })
    .title('This is the title of dialog')
    .textContent('This is the text content of the dialog')
    .ariaLabel('Attention')
    .targetEvent(evt)
    .ok('Accept')
    .cancel('Reject');
    $mdDialog.show(confirm).then(function() {
     // code
    }, function() {
    // code
    });
    }

太迟了，但您可以更改模板：$mdDialog.confirm（）。\u options.template
使用ng click=“dialog.hide（）”表示确定按钮，使用ng click=“dialog.abort（）表示取消

例如：

        var confirm = $mdDialog.confirm()

        confirm._options.template = '<div id="modal-gestion">' +
            '<div id="modal-gestion-title">' +
            '<h3>'+titulo+'</h3>' +
            '</div>' +
            '<div id="modal-gestion-body">' +
            '<p>¿Desea eliminar la ubicaión?</p>' +
            '</div>' +
            '<div id="modal-gestion-buttons">' +
            '<md-button class="btn btn-info" ng-click="dialog.hide()" id="modal-gestion-buttonSi">Eliminar</md-button>' +
            '<md-button class="btn btn-danger" ng-click="dialog.abort()" id="modal-gestion-buttonNo">Cancelar</md-button>' +
            '</div>' +
            '</div>'


        $mdDialog.show(confirm).then(function () {
              // code            }), function () {

        });   // code

var confirm=$mdDialog.confirm（）
确认。_options.template=''+
'' +
''+titulo+''+
'' +
'' +
“乌比卡翁之家”
”+
'' +
'' +
“Eliminar”+
“取消”+
'' +
''
$mdDialog.show（确认）。然后（函数（）{
//代码}），函数（）{
})；//代码
你真是天才！