Создать директиву для проверки входных данных - PullRequest
Новая
       23

Создать директиву для проверки входных данных

0 голосов
/ 08 мая 2019

У меня есть приложение, которое имеет много типов таблиц и различные типы входов. Каждый столбец имеет атрибуты, такие как регулярное выражение, число мин и макс для проверки этого ввода. Поэтому я хочу создать директиву, которая, если входные данные неверны, очищает ввод или не позволяет вставлять недопустимые символы.

Я создал одну директиву и импортировал плагин inputMask Плагин InputMask

и в директиве я использую одну функцию, чтобы проверить, является ли ввод верным или нет, и попытался применить маску или очистить ввод с помощью события. stopPropagation, но никто не работает! 

    import {Directive, ElementRef, HostListener, Input, OnChanges} from '@angular/core';
import { NgControl } from '@angular/forms';
import $ from 'jquery';
import * as Inputmask from 'inputmask';

@Directive({
  selector: '[appIntegralNumbersOnly]'
})
export class IntegralNumbersOnlyDirective {

  @Input() numberValidator: any; // the data
  @Input() isInputValid: any; // The component with the function to validate if data is or not valid

  constructor(private _el: ElementRef) {
  }
  @HostListener('input', ['$event']) onInputChange(event) {
    const regex = '^[1-9][0-9]*?$';

    var isvalid = (this.numberValidator.value.match(this.numberValidator.expression) !== null)? true : false;

    if (!(this.isInputValid.isColumnValid(this.numberValidator))) { // If is not valid apply mask

      Inputmask({regex: regex, placeholder: ''}).mask(this._el.nativeElement);
      //Inputmask("9", { repeat: 10 }).mask(this._el.nativeElement);

      //event.stopPropagation();
      //event.stopImmediatePropagation();
      //event.preventDefault();
    }
  }
}

Кто-нибудь может мне помочь? Почему StopPropagation не работает? Почему плагин не маскирует мой элемент.

Спасибо, С уважением

...