Параметр отключен для пользовательских элементов управления формы реагирования в результате Превышен максимальный размер стека вызовов - PullRequest
Новая
       26

Параметр отключен для пользовательских элементов управления формы реагирования в результате Превышен максимальный размер стека вызовов

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

Я создал пользовательский элемент управления вводом в своем проекте Angular. Все это работает хорошо, за исключением случаев, когда я устанавливаю для атрибута disabled значение true, тогда на setDisabledState происходит некоторый бесконечный цикл, приводящий к 

preview-4adb70f742b91f09679fb.js:1 ERROR RangeError: Maximum call stack size exceeded
    at eval (model.ts:1519)
    at eval (model.ts:1531)
    at eval (model.ts:1493)
    at Array.forEach (<anonymous>)
    at FormGroup._forEachChild (model.ts:1493)
    at FormGroup._reduceChildren (model.ts:1530)
    at FormGroup._reduceValue (model.ts:1518)
    at FormGroup._updateValue (model.ts:1505)
    at FormGroup.AbstractControl.updateValueAndValidity (model.ts:575)
    at FormControl.AbstractControl._updateAncestors (model.ts:533)

Я создал Stackblitz, показывая проблему: https://stackblitz.com/edit/angular-n34zrj

Я что-то упускаю из-за установки свойства disabled внутреннего FormControl (с помощью diabled (), enabled ())?

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

1 Ответ

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

В вашем коде вы запускаете цикл, устанавливая отключенное состояние в зависимости от логического параметра setDisabledState ().И внутри этого метода вы вызываете disable () / enable (), который сам будет вызывать setDisabledState (). 

  setDisabledState?(isDisabled: boolean): void {
    isDisabled ? this.control.disable() : this.control.enable();
  }

https://netbasal.com/angular-custom-form-controls-made-easy-4f963341c8e2

попробуйте что-то вроде того, что делает Netanel Basal: 

  setDisabledState( isDisabled : boolean ) : void {
    const div = this.textarea.nativeElement;
    const action = isDisabled ? 'addClass' : 'removeClass';
    this.renderer[action](div, 'disabled');
  }
...