Angular 7 реактивная форма patchValue to null после сбоя начальной FormGroup - PullRequest
Новая
       7

Angular 7 реактивная форма patchValue to null после сбоя начальной FormGroup

0 голосов
/ 23 января 2019

У меня есть FormGroup, где начальные данные могут быть или не быть нулевыми. Если это значение равно null, FormGroup будет построен как: 

this.dataForm = this.formBuilder.group({
    prop1: true,
    testGroup: this.formBuilder.group({
      data: null,
      check: { a: "a", b: "b"}
    })
});

Если оно не равно нулю, оно будет построено так: 

this.dataForm = this.formBuilder.group({
    prop1: true,
    testGroup: this.formBuilder.group({
      data: this.formBuilder.group({ x: 0, y: 1}),
      check: { a: "a", b: "b"}
    })
});

Проблема возникает, если я пытаюсь установить значение data на ноль, если оно изначально не было нулевым.

Я настроил стек здесь , чтобы продемонстрировать проблему. Ошибка:

не может преобразовать ноль в объект

По сути, вопрос заключается в следующем: как только свойство было установлено как FormGroup, как вы можете установить для него значение null?

1 Ответ

0 голосов
/ 23 января 2019

Это: data: this.formBuilder.group({ x: 0, y: 1}), определяет другую группу FormGroup. Что значит «установить его на ноль»? Вы хотите установить x и y на ноль? Удалить FormGroup? Я не уверен, что означает "установить в ноль" в контексте создаваемой вами группы форм.

Если вы хотите установить значение FormControls в FormGroup на нулевые значения, тогда это работает: 

changeToNull2() {
  console.log(this.dataForm2);
  console.log(this.dataForm2.get('testGroup').value);
  this.dataForm2.get('testGroup.data').patchValue({
    x: null,
    y: null
  });
}

Если вы хотите удалить группу FormGroup, определенную data, вы можете использовать removeControl() следующим образом: 

  (<FormGroup>this.dataForm2.get('testGroup')).removeControl('data');

Обновлен стек, который отображает оба: https://stackblitz.com/edit/angular-7-reactive-form-validation-aeshez

UPDATE

Просто чтобы уточнить, в этом коде: 

this.dataForm = this.formBuilder.group({
    prop1: true,
    testGroup: this.formBuilder.group({
      data: null,
      check: { a: "a", b: "b"}
    })
});

data - это FormControl, значение которого по умолчанию равно нулю.

В этом коде: 

this.dataForm = this.formBuilder.group({
    prop1: true,
    testGroup: this.formBuilder.group({
      data: this.formBuilder.group({ x: 0, y: 1}),
      check: { a: "a", b: "b"}
    })
});

data - это FormGroup с двумя FormControls: x со значением по умолчанию 0 и y со значением по умолчанию 1.

...