Передача параметра в пользовательский валидатор формы на основе шаблона Angular 7

Question

Как я могу передать параметр в специальный валидатор, написанный для управляемой шаблоном формы в Angular 7?

Я собрал следующий код из множества других вопросов и постов в блоге, но большинство сосредоточено вокругРеактивные формы, а не tempalte.

import { AbstractControl, ValidatorFn, NG_VALIDATORS, Validator, FormControl } from '@angular/forms';
import { Directive, Input } from '@angular/core';

// validation function
function validateMinValue(minValue: number): ValidatorFn {
    return (c: AbstractControl) => {

        console.log(minValue); 
        return null;
    }
}

@Directive({
    selector: '[minValue][ngModel]',
    providers: [
        { provide: NG_VALIDATORS, useExisting: MinValueValidator, multi: true }
    ]
})
export class MinValueValidator implements Validator {
    @Input("minValue") minValue;
    validator: ValidatorFn;

    constructor() {
        this.validator = validateMinValue(this.minValue);
    }

    validate(c: FormControl) {
        return this.validator(c);
    }
}

Как я могу получить доступ к значению, переданному в minValue на входе, подобном этому

<input type="text" name="testInput" class="form-control"
        [(ngModel)]="testValue" required
        currencyMask [options]="{ thousands: ',', decimal: '.' }"
        minValue="100">

Answer 1

Вы должны использовать ngOnInit ловушку для инициализации валидатора, поскольку еще нет свойства Input, инициализированного в конструкторе.

ngOnInit() {
   this.validator = validateMinValue(this.minValue);
}

Таким образом, инициализированное значение будет передано вашему валидатору.

Другой способ - просто определить валидатор в вашей пользовательской директиве и взять minValue из текущего контекста this:

export class MinValueValidator implements Validator {
    @Input("minValue") minValue;

    validate(c: FormControl) {
        console.log(this.minValue); 
        return null;
    }
}