我尝试在我的角度项目中使用:: ng-deep自定义角度材料形式字段,我所面临的问题是仅在刷新页面或单击页面时才应用了css应用。
我尝试使用:: ng-deep并尝试在ts文件中设置Encapsulation.None。
<div class="input-row">
<div class="call-out-grt">
<div class="box">
<mat-label class="arrival">GRT-NRT-DWT</mat-label>
<div class="box-1">
<mat-form-field class="cranes" appearance="outline">
<input matInput type="text">
</mat-form-field>
</div>
<div class="box-1">
<mat-form-field class="cranes" appearance="outline">
<input matInput type="text">
</mat-form-field>
</div>
<div class="box-1">
<mat-form-field class="cranes" appearance="outline">
<input matInput type="text">
</mat-form-field>
</div>
</div>
</div>
<div class="call-out">
<mat-form-field class="flag-field">
<input matInput type="text" placeholder="Flag">
</mat-form-field>
</div>
<div class="call-out-date">
<mat-form-field class="flag-field">
<input matInput type="text" placeholder="Built Date">
</mat-form-field>
</div>
</div>
::ng-deep .cranes .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-outline {
width: 55px ;
height: 50px;
margin-left: 2px;
}
css表单应在不刷新的情况下应用