Блог

Как определить (в текстовой области), присутствует ли какой-либо URL в значении текстовой области? Я захочу определять URL-адреса по всей записи, например, проверять слово, которое было введено после каждого пробела, или если я вставляю что-либо в текстовую область.

Также могу ли я проверить, является ли это допустимым URL. Потому что, если он действителен, я выполню вызов API на основе этого действительного URL.

Заранее благодарю вас.

 <textarea (keyup)=onKeyUp($event) [(ngModel)]="textval" (paste)="onPaste($event)"></textarea>

onKeyUp(event){
  //check if any url present in value on key up
}


onPaste(event : any){
  ////check if any url present in value if pasting anything
}
  

Вы можете использовать Router для получения URL-адреса и сопоставления его с переменной ngModel textval и проверки шаблона, если это допустимый ввод, затем вы отправляете его. Вот как вы используете маршрутизатор в своем компоненте и проверке шаблона

 textval: any;

constructor(private currentRoute: Router) { }

ngOnInit() {
this.textval = this.currentRoute.url;
}
  

Регулярное выражение для проверки действительного URL-адреса (это один из примеров, который вы можете изменить в зависимости от ваших требований)

 /^(?:http(s)?://)?[w.-] (?:.[w.-] ) [w-._~:/?#[]@!$amp;'()* ,;=.] $/;
  

Используйте это в текстовой области

 <textarea [pattern]="/^(?:http(s)?://)?[w.-] (?:.[w.-] ) [w-._~:/?#[]@!$amp;'()* ,;=.] $/" (keyup)=onKeyUp($event) [(ngModel)]="textval" (paste)="onPaste($event)"></textarea>
  

Если вы используете реактивные формы из angular, вы можете добавить регулярное выражение в качестве средства проверки

 const reg = '(https?://)?([\da-z.-] )\.([a-z.]{2,6})[/\w .-]*/?';

this.form = fb.group({

  url: ['', [Validators.required, Validators.pattern(reg)]]

})