angular-material - 如何删除轮廓垫形式字段边界角半径

Question

我正在使用有角度的 Material 轮廓垫-表单域设计表单。
我正在获取带有边框角半径的默认mat-form-field轮廓文本框 View 。有什么方法可以删除轮廓mat-form-field的边界角半径并将其转换为方形文本框 View 。

我尝试使用以下方法更改角度 Material 的mat-form-field的默认样式，但是它不起作用。

//css

.mat-form-field-appearance-outline .mat-form-field-outline-start 
.alignment{
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
}

//html

<mat-form-field appearance="outline" [hideRequiredMarker]="true" 
class="alignment">
<mat-label>Email Address</mat-label>
<input type="text" matInput placeholder="Enter email address">
</mat-form-field>

我希望没有边框角半径文本框的轮廓垫形式字段，就像方形文本框垫形式字段一样，但是会得到默认的轮廓垫形式字段 View 。

Answer 1

素材 v7.3.4

.mat-form-field-outline-start, .mat-form-field-outline-end {
    border-radius: 0 !important;
}