<mat-form-field *ngIf="editMode" [appearance]="fieldAppearance"  style="width: 100%">
  <mat-label>
    <span>Phone</span>
  </mat-label>
  <input matInput type="text" [formControl]="formControlComponent"
         [placeholder]="'Input phone'" [errorStateMatcher]="matcher"/>
  <mat-icon  color="accent" matSuffix>phone</mat-icon>

  <mat-error *ngIf="formControlComponent.hasError('pattern')">
    <span [innerHTML]="'Wrong phone number'"></span>
  </mat-error>

</mat-form-field>

<div *ngIf="!editMode">
  <div>{{formControlComponent.value}}</div>
</div>

