typescript - Angular 2 Send parameter til en validatorfunksjon
Jeg har et array i min formcomponent-klasse og ønsker å kunne sende dette arrayet til en validatorfunksjon. Når jeg legger til flere validatorer til skjemaet, bruker jeg Validators.compose-funksjonen. Dette godtar imidlertid kun navnet på validatorfunksjonen, og ikke noen parametere å sende med. Er det mulig å legge til parametere til funksjonskallene inni "compose"-funksjonen?
export class ClientFormComponent
{
clientForm: ControlGroup;
npi: AbstractControl;
name: AbstractControl;
constructor(private _clientService: ClientService, _fb: FormBuilder) {
this.clientForm = _fb.group({ 'name': ['', Validators.compose([Validators.required])], 'npi': ['', Validators.compose([Validators.required, npiNumValidator, Validators.maxLength(10), Validators.minLength(10)])]});
this.name = this.clientForm.controls['name'];
this.npi = this.clientForm.controls['npi'];
}
@Input() clientList;
active = true;
onSubmit(value: Client) {
this._clientService.addDeleteClient(value, true)
.subscribe(
client => this.clientList.push(client));
}
}
function npiNumValidator(control: Control): { [s: string]: boolean } {
if (isNaN(control.value)) {
return { npiNAN: true };
}
}Takk for all hjelp!
Svar #1
Er det mulig å legge til parametere til funksjonskallene inne i «compose»-funksjonen?
Validatorerklæring: rett ut av Angular-kode
/* Validator that requires controls to have a value of a minimum length. */
static minLength(minLength: number): ValidatorFn {
return (control: modelModule.AbstractControl): {[key: string]: any} => {
if (isPresent(Validators.required(control))) return null;
var v: string = control.value;
return v.length < minLength ?
{"minlength": {"requiredLength": minLength, "actualLength": v.length}} :
null;
};
}
Bruk:
Validators.compose([Validators.minLength(4)]
MERK: for å forstå det bedre, se Hvordan fungerer JavaScript-closures?
Svar #2
Bare flytt det til en klasse
class NpiNumValicator {
constructor(private someField: someType) {}
npiNumValidator(control: Control): { [s: string]: boolean } {
if (isNaN(control.value)) {
return { npiNAN: true };
}
}
}
bruk det da som
this.clientForm = _fb.group({ 'name': ['',
Validators.compose([Validators.required])], 'npi': ['',
Validators.compose([Validators.required,
new NpiNumValidator(someArg).npiNumValidator,
Validators.maxLength(10), Validators.minLength(10)
])
]});
for å kunne bruke this innenfor npiNumValidator kan du bruke
var npiNumVal = new NpiNumValidator(someArg);
this.clientForm = _fb.group({ 'name': ['',
Validators.compose([Validators.required])], 'npi': ['',
Validators.compose([Validators.required,
npiNumVal.npiNumValidator.bind(npiNumVal),
Validators.maxLength(10), Validators.minLength(10)
])
]});
