Блог

У меня есть простой ввод ясности в моем проекте (ссылка на StackBlitz здесь).

 <div class="clr-form-control" [ngClass]="{'clr-error': myInput.errors}">
    <label class="clr-control-label">My Input</label>
    <div class="clr-control-container">
        <div class="clr-input-wrapper">

            <input id="myinput" type="number" class="clr-input" min="1" max="10"
                [(ngModel)]="inputValue" #myInput="ngModel" appMyCheck="12"/>

            <clr-icon class="clr-validate-icon" shape="exclamation-circle"></clr-icon>
        </div>
        <span class="clr-subtext" *ngIf="myInput.errors?.inRange">
            Error
          </span>
    </div>
</div>
  

Я добавил appMyCheck к нему директиву validator. Вот код директивы

 @Directive({
  selector: '[appMyCheck]',
  providers: [{provide: NG_VALIDATORS, useClass: MyCheckDirective, multi: true}]
})
export class MyCheckDirective implements Validator {
  @Input('appMyCheck') myValue;
  constructor() { }

  validate(control: AbstractControl): {[key: string]: any} | null {
    console.log('in validate ', this.myValue);
    return null;
  }
}
  

Поэтому я пытаюсь отправить параметр myValue (который отправляется из кода шаблона appMyCheck="12" ) в директиву и просто распечатать его. Но он всегда отображает undefined значение.

 in validate  undefined
in validate  undefined
  

Как я могу правильно отправить параметр в директиву validator?

Я редактирую ваш код, и он работает https://stackblitz.com/edit/clarity-nkksjf?file=app/my-check.directive.ts

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

@Directive({
  selector: '[appMyCheck]',
   providers: [{
    provide: NG_VALIDATORS,
    useExisting: forwardRef(() => MyCheckDirective),
    multi: true
  }]
})
export class MyCheckDirective implements Validator {
  isValid: any = false;

  @Input('appMyCheck') myValue;
   set setter (state) {
    this.isValid = state;
  };
  constructor() { }

  validate(formController: AbstractControl) {
   const validationState = !this.isValid ? {
      customKey: true
    } : null;

    console.log('validation state: ', validationState);
    return validationState;
  }


 
}
  

Надеюсь, полезно