Angular 6, превращающий пользовательскую функцию валидатора в класс, дающий неопределенную ошибку функции

Question

Я создал этот пользовательский валидатор, чтобы проверить, заканчивается ли электронная почта определенным доменом:

import { AbstractControl } from '@angular/forms';
import { stringify } from '@angular/compiler/src/util';

export function validateEmailDomain(control: AbstractControl)
    {

        if(!stringify(control.value).endsWith('test.com'))
        {
            return {response: true};
        }
        return null;
    }
}

Затем я применил его к определенному контролю реагирующей группы форм:

'email': new FormControl('', [Validators.email, validateEmailDomain]),

Этот скрипт хорошо работает.Но у меня есть служба глобальных переменных, в которую я добавляю все свои переменные, используемые в моем проекте, поэтому, когда я продаю его организации или компании, я просто меняю несколько переменных, таких как изображение логотипа, значок, заголовок и домен почтового сервера.вместо того, чтобы переходить к каждому компоненту и изменять его вручную.

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

После нескольких поисков переполнения стека я прочитал, что должен преобразовать функцию экспорта в класс, поэтому я сделал следующее:

import { AbstractControl } from '@angular/forms';
import { stringify } from '@angular/compiler/src/util';
import { GlobalVarService } from 'src/app/global-var.service';

export class emailDomain{
    constructor(private globalVar: GlobalVarService){}
    static validateEmailDomain(control: AbstractControl) {

        if (!stringify(control.value).endsWith(this.globalVar.emailDomain)) {
            return { response: true };
        }
        return null;
    }
}

и для элемента управления:

  'email': new FormControl('', [Validators.email, emailDomain.bind(validateEmailDomain)]),

Этоне работает, так как я получил ошибку undefined validateEmailDomain в строке выше.

Answer 1

Вы можете сделать свой валидатор более общим:

export function validateEmailDomain(globalVar) {
 return function (control) {
    if(!stringify(control.value)
        .endsWith(globalVar.emailDomain))
    {
     return {response: true};
    }
    return null;
   };
}

Тогда, когда вы используете его, просто передайте глобальные переменные:

'email': new FormControl('', 
 [Validators.email, validateEmailDomain(this.globalVar)]),

Answer 2

Я бы сделал это следующим образом.

Объявите одну переменную

validateEmailDomain: any;
//add service in the same component
constructor(private globalVar: GlobalVarService){}
// then in ngOnInit initialize your var
ngOnInit(): void {
    this.validateEmailDomain = (control: FormControl) => {
      // you have the control here and you can call any exported method like validateEmailDomain(control: AbstractControl, globalVar: GlobalVarService)

      if (!stringify(control.value).endsWith(this.globalVar.emailDomain)) {
          return { response: true };
      }
      return null;
  };
}

, затем используйте ее как

'email': new FormControl('', [Validators.email, this.validateEmailDomain]),

Дайте мне знать, если я пропустилчто-нибудь

Обновление

export function validateEmailDomain(control: AbstractControl, globalVar: GlobalVarService) {
// your validations
}

И затем используйте этот метод как

this.validateEmailDomain = (control: FormControl) => {
  return validateEmailDomain(control, this.globalVar);
};

Answer 3

Вместо этого:

emailDomain.bind(validateEmailDomain)

используйте это

emailDomain.bind(emailDomain.validateEmailDomain)

---

Ответ на другой вопрос от commnent (ошибка: Property 'globalVar' does not exist on type 'typeof emailDomain'):

Выне может использовать динамическое поле класса (globalVar) внутри статического метода.Поэтому можно попытаться передать это значение в качестве статического параметра метода, например (я пишу код из головы, поэтому протестируйте его)

// I assume that you have this.globalVar here (so no in emailDomain constructor, but in place where you use that class), and also you have control: FormCotnrol object

'email': new FormControl('', [
    Validators.email, 
    emailDomain.bind( () => emailDomain.validateEmailDomain(control , this.globalVar) )
])

Конечно, вам нужно изменить emailDomain.validateEmailDomai, чтобы использовать этот параметр