nomulus/console-webapp/src/app/settings/rdap/rdapEdit.component.html

<div
  class="console-app__rdap-edit"
  *ngIf="registrarInEdit"
  cdkTrapFocus
  [cdkTrapFocusAutoCapture]="true"
>
  <button
    mat-icon-button
    class="console-app__rdap-edit-back"
    aria-label="Back to rdap view"
    (click)="rdapService.editing = false"
  >
    <mat-icon>arrow_back</mat-icon>
  </button>

  <div class="console-app__rdap-edit-controls">
    <span>
      General registrar information for your RDAP record. This information is
      always visible in RDAP.
    </span>
    <div class="spacer"></div>
  </div>

  <div class="console-app__rdap-edit">
    <h1>Personal info</h1>

    <form (ngSubmit)="save($event)">
      <mat-form-field appearance="outline">
        <mat-label>Email: </mat-label>
        <input
          matInput
          type="email"
          [(ngModel)]="registrarInEdit.emailAddress"
          [ngModelOptions]="{ standalone: true }"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Phone: </mat-label>
        <input
          matInput
          type="text"
          [(ngModel)]="registrarInEdit.phoneNumber"
          [ngModelOptions]="{ standalone: true }"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Fax: </mat-label>
        <input
          matInput
          type="text"
          [(ngModel)]="registrarInEdit.faxNumber"
          [ngModelOptions]="{ standalone: true }"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Street Address (line 1): </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="registrarInEdit.localizedAddress.street![0]"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Street Address (line 2): </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="registrarInEdit.localizedAddress.street![1]"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>City: </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="(registrarInEdit.localizedAddress || {}).city"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>State or Province: </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="(registrarInEdit.localizedAddress || {}).state"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Country: </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="(registrarInEdit.localizedAddress || {}).countryCode"
        />
      </mat-form-field>

      <mat-form-field appearance="outline">
        <mat-label>Postal code: </mat-label>
        <input
          matInput
          type="text"
          [ngModelOptions]="{ standalone: true }"
          [(ngModel)]="(registrarInEdit.localizedAddress || {}).zip"
        />
      </mat-form-field>

      <button
        mat-flat-button
        color="primary"
        type="submit"
        aria-label="Save RDAO settings"
      >
        Save
      </button>
    </form>
  </div>
</div>