Angular oninput 사용 예시 / 이메일 정규식

<div [title]="inputSet.title" [class]="inputSet.class">
  <input #inputRef type="text" [id]="inputSet.id" [maxLength]="inputSet.maxlength"
  oninput="test = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i.test(this.value)">
</div>

1. oninput 속성은 (oninput) 으로 사용하면 함수를 못찾으므로 직접 정규식을 HTML 에 넣고 결과값을 받아 해당 값을 컴포넌트에서 처리하도록 합니다.

 

 

 

 

<div [title]="inputSet.title" [class]="inputSet.class">
  <input #inputRef type="text" [id]="inputSet.id" [maxLength]="inputSet.maxlength"
  (input)="isEmail($event)">
</div>

2.  (input) 사용하면 oninput. 동일하게 작동합니다.