Специальный символ в шаблоне угловой формы Controller - PullRequest
Новая
       52

Специальный символ в шаблоне угловой формы Controller

0 голосов
/ 15 октября 2019

Как и в следующем StackBlitz

У меня есть элемент управления формы с проверкой шаблона 

  formController = new FormControl(null, [Validators.required, Validators.pattern('^, &, *, (, ), +, -, {, }, [, ], <, >,')]);

В HTML у меня есть 

<div [innerHTML]="'Write : ^, &, *, (, ), +, -, {, }, [, ], <, >,'"></div>
<form>
      <input matInput type="text" [formControl]="formController" autocomplete="off" placeholder="^, &, *, (, ), +, -, {, }, [, ], <, >,">
        <div *ngIf="formController.hasError('required')">
            POPUP.DELETE_CONFIRMATION_UNMATCHED_REQUIRED
        </div>
        <div *ngIf="formController.hasError('pattern')">
            POPUP.DELETE_CONFIRMATION_UNMATCHED_PATTERN
        </div>
</form>

Проблема в том, что шаблон никогда не совпадает.

В примере шаблон в статическом, но в моем приложении шаблон - это имя поля, и он может содержать любые символы.

FormControl не работает только тогда, когда шаблон включает в себя специальный символ, он работает нормально для любого другого имени.

Как это исправить?

РЕДАКТИРОВАТЬ: Дело в том, что это для подтверждения удаления, как в github repo.

Когда вы удаляете вещь, вы должны точно ввести имя репо.

В приложении имя может включать специальный символ, поэтому, если имя репо - ^, &, *, (, ), +, -, {, }, [, ], <, >,', мне нужно ввести шестнадцатеричный ^, &, *, (, ), +, -, {, }, [, ], <, >,' и больше ничего, если имя будет myProject1, только myProject1 будет работать

Ответы [ 2 ]

0 голосов
/ 16 октября 2019

Пожалуйста, проверьте код ниже, правильный формат регулярного выражения реализован 

import { Component, ViewChild, AfterViewInit } from '@angular/core';
import { NgControl, FormGroup, FormControl, Validators } from '@angular/forms';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  @ViewChild('hello') hello: NgControl;

  formController = new FormControl(null, [Validators.required, Validators.pattern('^([,:\\+\-<>{}&*^()\\[\\]/-]*)$')]);

  name = 'Angular 5';
}
0 голосов
/ 15 октября 2019

Проблема в том, что ваше выражение ищет что-то вроде

, & ,,,,, -, {,}, ,, <,>,

вместо специального символа. Все, что вам нужно, это изменить выражение вашего выражения на что-то вроде: 

formController = new FormControl(null, [Validators.required, Validators.pattern(/[ !@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/)]);
...