iT邦幫忙

2

[已解決] Angular ReactiveForm 的 Validator --- 只有 required 有效其他都沒效

  • 分享至 

  • xImage

如題...
errors只列印出required
試過minLength(),maxLength(),parttern都列印不出來...
是哪裡寫錯了嗎...??
列印出的結果---

startNum: FormControl
errors:
required: true
__proto__: Object
pristine: true
status: "INVALID"

程式碼
html

<form  [formGroup]="form">
<input 
type="number" 
class="input" 
formControlName="startNum">

ts

public form!: FormGroup;
constructor(private fb: FormBuilder,) {}
ngOnInit(): void {
    this.form = this.fb.group({
     startNum: new FormControl('',{
        validators: [
          Validators.minLength(4),
          Validators.required,
          Validators.pattern('\d{7}')
        ],
      }),
    });
  }

找不到問題出在哪@@~感恩~

abhor115 iT邦新手 5 級 ‧ 2021-05-16 17:00:05 檢舉
minLength >minlength 應該用小寫
用('\\d{7}) 試試
('\\d{7})修好了! 感恩

minlength 小寫vscode會報錯
“Property 'minlength' does not exist on type 'typeof Validators'. Did you mean 'minLength'?“
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

3
黃升煌 Mike
iT邦研究生 5 級 ‧ 2021-05-16 17:25:59
最佳解答

問題出在 <input type="number" ...>
minLength 是判斷字串長度,也就是 "123".length 這種,但 type=number 的設定會讓你拿到數值,判斷 123.length 是錯誤的

BTW,應該是 Reactive Forms

成功解決了! ~~~謝謝!

我要發表回答

立即登入回答