Как настроить поле формы углового материала - PullRequest
Новая
       33

Как настроить поле формы углового материала

0 голосов
/ 23 сентября 2019

Я попытался настроить поле формы углового материала с помощью :: ng-deep в моем угловом проекте. Проблема, с которой я сталкиваюсь, заключается в том, что применено css применяется только при обновлении страницы или при нажатии на нее.

Iпопытался использовать :: ng-deep и попытался установить Encapsulation.None в моих файлах TS.

<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 должна применяться без ее обновления

...