Allowint space in custom field

src/app/checklist/checklist.component.html

@@ -144,10 +144,11 @@
                   <!-- form for custom field validation. -->
                   <form #cf="ngForm">
                     <mat-form-field class="app-field-padding">
+                      <!-- Pattern matching alphanumeric characters with "_", "-" and "space" in middle. -->
                       <input matInput placeholder="Add custom field" [(ngModel)]="customField"
-                        pattern="^[A-Za-z0-9_-]*$" name="customField" #customText />
+                        pattern="^[^_-\s][A-Za-z0-9_-\s]*[^_-\s]$" name="customField" #customText />
                       <mat-error *ngIf="cf.controls['customField']?.errors">
-                        Alphanumeric charecters with _ and - are allowed.
+                        Alphanumeric charecters with space, _ and - inbetween are allowed.
                       </mat-error>
                     </mat-form-field>
                     <mat-icon class=" app-primary-color addIcon" [disabled]="cf.invalid"