sandip1699

app.module.ts
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

app.ts
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';

constructor(public formBuilder : FormBuilder) {}

ngOnInit() {
    this.myform = this.formBuilder.group({

sandip1699

<mat-form-field appearance="outline">
  <mat-label>Notary Type</mat-label>
  <mat-select placeholder="Select Notary Type" formControlName="notaryType" [disableOptionCentering]="true"
    [(ngModel)]="savenotaryObj.idOfNotaryType" required>
    <mat-option *ngFor="let type of allNotaryType" [value]="type.id">{{type.name}}</mat-option>
  </mat-select>
  <mat-error *ngIf="hasError('notaryType', 'required')">
    {{utilsService.validationService.NOTARY_TYPE_REQUIRED}}</mat-error>
</mat-form-field>

sandip1699

.sep-element { border-bottom: 1px solid #237ac6; display: inline-block; margin: 0 auto; position: relative; width: 100px; }
.sep-element::after { background-color: #ffffff; border: 1px solid #237ac6; content: ""; display: block; height: 11px; left: 50%; margin-left: -5px; margin-top: -5px; position: absolute; top: 0; width: 10px; }


/* ===============  input berfore wrap:before  ============================*/
wrap::before { background: rgba(255, 255, 255, 0.05) none repeat scroll 0 0; border: 1px solid #646464; bottom: 0; content: ""; left: -25px; position: absolute; right: -15px; top: 0; transform: skew(-33deg); transition: all 400ms ease 0s; }


/* =============== big right arrow ============================*/