Как получить значения из отключенных элементов управления формы в группе форм как поток? (как метод valueChanges) - PullRequest
0 голосов
/ 03 февраля 2020

Обычное поведение Angular отключенного FormControl внутри группы форм - пропуск ключа / значения контроллера. но мне нужно сохранить структуру результата объекта формы - поэтому мне нужно, чтобы ключ контроллера отключений появился внутри конечного объекта значения формы.

, есть простое решение получить его с помощью метода "getRowValue () "но это не поток ... есть встроенный способ получить его в потоке?

пример

myForm = new FormGroup({   
    name:new FormControl({value:'',disabled:true}),
    power:new FormControl('')
  })

результат с valueChanges () {power : anyValue}

мне нужно {power: anyValue, имя: ""}

пример в стеке

Ответы [ 2 ]

2 голосов
/ 03 февраля 2020

Добавьте что-то подобное в ваш компонент:

rawValueChanges = this.myForm.valueChanges.pipe(
  map(_ => this.myForm.getRawValue())
)

См. рабочий пример в StackBlitz

1 голос
/ 03 февраля 2020

Идея состоит в том, чтобы "сохранить" последнее состояние вашей формы в свойстве, которое вы будете обновлять при каждом обновлении формы:

  public formSave = null;

  ...

  ngAfterViewInit() {
    if (!this.formSave) {
      setTimeout(() => {
        this.formSave = this.myForm.value;
      });
    }

    this.myForm.valueChanges.subscribe(newVal => {
      console.log('changes', newVal);
      this.formSave = {...this.formSave, ...newVal};
    });
  }

Некоторые объяснения:

{...this.formSave, ...newVal} (называемый spread operator) принимает исходное сохраненное значение формы (с вашим отключенным значением в случае, если оно было отключено) и объединяет новое значение, возвращаемое потоком valueChanges.

Почему setTimeout()? Просто избегать ExpressionChangedAfterItHasBeenCheckedError, так как мы модифицируем свойство класса в ловушке жизненного цикла . Поэтому для запуска новой проверки цикла я помещаю инициализацию свойства в это утверждение. Но вы также можете исправить это с помощью ChangeDetectorRef (но это не так c).

Поскольку возвращаются только разрешенные значения, оно не меняет значения (s). ) отключенных полей.

Вот ваше рабочее приложение StackBlitz

...