You can use the align HTML attribute:
<div mat-dialog-content>
<p>What's your favorite animal?</p>
<mat-form-field>
<input matInput [(ngModel)]="data.animal">
</mat-form-field>
</div>
<div mat-dialog-actions align="end">
<button mat-button [mat-dialog-close]="data.animal" cdkFocusInitial>Ok</button>
</div>
Demo
Note: The reason why setting an align="end" attribute works on the dialog’s actions container is because the align attribute is used to add flexbox properties to the dialog actions in the dialog component’s theming SCSS file:
(Extract of dialog.scss)
.mat-dialog-actions {
// ...
&[align='end'] {
justify-content: flex-end;
}
&[align='center'] {
justify-content: center;
}
}
Here’s the source code.