Я пытаюсь создать реактивную форму, используя FormBuilder
из @angular/forms
, но я наткнулся на случай, касающийся пользовательской проверки @Directives, @Inputs и FormBuilder
.
В следующем коде у меня есть моя пользовательская директива MatchValidator, вопрос в том, как я могу присвоить значения переменным @Input при определении моего FormGroup
?
// My custom Directive
@Directive( {
selector: "[cw-match]",
providers: [ { provide: NG_VALIDATORS, useExisting: MatchValidator, multi: true } ]
} )
export class MatchValidator implements Validator,OnChanges {
@Input() matchTo; // <— How to assign values to this properties using formBuilder?
@Input() control;
ngOnChanges( changes:SimpleChanges ) {
this.control.control.updateValueAndValidity( false, true );
}
validate( control:AbstractControl ):{ [ key:string ]:any; } {
if( !control.value ) return null;
return ( control.value === this.matchTo )? null : { "matchError": true };
}
}
// My component
@Component( /*… */)
export class UserDetailsComponent implements OnChanges, AfterViewInit {
constructor( formBuilder: FormBuilder ){
this.userDetailsForm = this.formBuilder.group( {
slug: [ "", SlugValidator ],
basicCredentials: this.formBuilder.group( {
username: [ "", Validators.required ],
password: [ "", MatchValidator ], // <— How can I assign the matchTo and control values the @Input properties of the directive asks for?
repeatPassword: [ "" ],
} )
} );
}
}
Можно ли даже присвоить значения @Input для валидации @Directive с помощью FormBuilder ??
Заранее спасибо:)