角度形式错误类型错误:没有"new"就无法调用类构造函数验证器



我得到以下角度形式错误-

ERROR TypeError: Class constructor Validators cannot be invoked without 'new'
at forms.js:1480
at Array.map (<anonymous>)
at _executeValidators (forms.js:1476)
at FormControl.validator (forms.js:1418)
at FormControl._runValidator (forms.js:4089)
at FormControl.updateValueAndValidity (forms.js:4050)
at new FormControl (forms.js:4656)
at FormBuilder.control (forms.js:8951)
at FormBuilder._createControl (forms.js:9011)
at forms.js:8990

有人能告诉我我缺了什么吗?

我的HTML:

<form class="formLogin" [formGroup]="personalForm" (ngSubmit)="onSubmit()">
<div class="form-group  rtl">
<label class="col-sm-3 control-label pull-right" for="mail"> your email</label>
<div class="col-sm-9">
<input type="text" formControlName="mail" [value]="person.Email" placeholder="myAddress@gmail.com" class="form-control ltr textBox" email [ngClass]="{ 'is-invalid': submitted && f.mail.errors }" />
<div *ngIf="submitted && f.mail.errors" class="invalid-feedback">
<div *ngIf="f.mail.errors.required">requird</div>
<div *ngIf="f.mail.errors.email">invalid address!</div>
</div></div>
</div>
<br><br>
<div class="form-group  rtl">
<label class="col-sm-3 control-label pull-right" for="phone">your phone</label>
<div class="col-sm-9">
<input type="text" formControlName="phone" [value]="person.Phone"  class="form-control ltr textBox" placeholder="000-0000000" [ngClass]="{ 'is-invalid': submitted && f.phone.errors }" />
<div *ngIf="submitted && f.phone.errors" class="invalid-feedback">
<div *ngIf="f.phone.errors.required">requird!</div>
<div *ngIf="f.phone.errors.pattern">digits only!</div>
</div></div>
</div>
<br><br>
<div class="form-group rtl">
<label class="col-sm-3 control-label pull-right" for="username">your username</label>
<div class="col-sm-9">
<input type="text" (focus)="incorrectData=false" [value]="person.UserName" formControlName="username" class="form-control textBox " [ngClass]="{ 'is-invalid': submitted && f.username.errors }" />
<div *ngIf="submitted && f.username.errors" class="invalid-feedback">  
<div *ngIf="f.username.errors.required">required!</div>
</div></div>
</div>
<br><br>
<div class="form-group rtl">
<label class="col-sm-3 control-label pull-right" for="password">your password</label>
<div class="col-sm-9">
<input type="password" (focus)="incorrectData=false" [value]="person.Password" minlength="6" formControlName="password" class="form-control textBox" [ngClass]="{ 'is-invalid': submitted && f.password.errors }" />
<div *ngIf="submitted && f.password.errors" class="invalid-feedback">
<div *ngIf="f.password.errors.required">requird!</div>
<div *ngIf="f.password.errors.minlength">password length minimum 6 letters!</div>
</div></div>
</div>
<br>
</form>

我的ts:

import { Component, OnInit } from '@angular/core';
import { UserService } from '../../../services/user.service';
import { User,UserEnum } from 'src/app/classes/User';
import { FormBuilder, FormGroup,Validators} from '@angular/forms';    
@Component({
selector: 'app-personal-details',
templateUrl: './personal-details.component.html',
styleUrls: ['./personal-details.component.css']
})
export class PersonalDetailsComponent implements OnInit {
person:User;
personalForm:FormGroup;
submitted :boolean;
constructor(private userSer:UserService,
private formBuilder: FormBuilder){ }
ngOnInit() {
this.person=this.userSer.userDetailes;
this.personalForm = this.formBuilder.group({
email:['',[Validators.required,Validators.email]],
password: ['', [Validators.required,Validators.minLength(6),Validators]],
username: ['', Validators.required],
phone:['',[Validators.required,Validators.maxLength(10),Validators.minLength(9),Validators.pattern('[0-9]*')]]});}
get f()
{ return this.personalForm.controls; }
saveUser() {}
onSubmit()
{
this.submitted = true;
// stop here if form is invalid
if (this.personalForm.invalid) 
{return;}
this.saveUser();}
}

用户服务:

@Injectable({
providedIn: 'root'
})
export class UserService   {
userDetailes:User=null;
}

我的app.module有很好的表单导入,项目中的其他表单运行良好。我认为问题出在这个组件上。

而不是:

密码:〔'',[验证程序.必需,验证程序.最小长度(6(,验证程序]],

我不得不写:

密码:〔'',[验证器.必需,验证器.最小长度(6(,验证器.最大长度(10(]],

正如上面所写的,您的问题是因为您以错误的方式引用了验证器。您需要包括您试图调用或调用的方法。在这种情况下,您的线路

password: ['', [Validators.required,Validators.minLength(6),Validators]],

应该是

password: ['', [Validators.required,Validators.minLength(6),Validators.maxLength(20)]],// or any other measure you wish to put in place.  Validators is the problem here