[angular] Angular 2 비활성화 된 컨트롤은 양식에 포함되지 않습니다.

Program / 글쓴이

Angular 2 반응 양식에서 컨트롤을 비활성화하면 컨트롤이 form.value에 포함되지 않는다는 것을 알았습니다. 예를 들어 다음과 같이 내 양식을 정의하면 :

this.notelinkingForm = new FormGroup({
    Enabled: new FormControl(settings.Enabled, Validators.required),
    LinkToPreceeding: new FormControl({value: settings.LinkToPreceeding, disabled: !settings.Enabled}, Validators.required),
    LinkingTolerance: new FormControl({value: settings.LinkingTolerance, disabled: !settings.Enabled}, Validators.required)
});

this.notelinkingForm.value를 확인하고 모든 컨트롤이 활성화 된 경우 출력은 다음과 같습니다.

{"Enabled":true, "LinkToPreceeding": true, LinkingTolerance:"100"}

그러나 일부 컨트롤이 비활성화되면 다음과 같습니다.

{"Enabled":true}

비활성화 된 컨트롤이 어떻게 제외되는지 확인하십시오.

내 의도는 양식이 변경 될 때 모든 속성과 함께 form.value를 나머지 API로 전달할 수 있기를 원한다는 것입니다. 비활성화 된 항목이 포함되어 있지 않으면 분명히 불가능합니다.

여기에 뭔가 누락되었거나 예상되는 동작입니까? Angular에게 form.value에 비활성화 된 항목을 포함하도록 지시하는 방법이 있습니까?

당신의 생각을 환영합니다.

답변

당신이 사용할 수있는:

this.notelinkingForm.getRawValue()

에서 문서 :

비활성화 상태에 관계없이 모든 값을 포함하려면이 방법을 사용하십시오. 그렇지 않으면 value속성이 그룹의 가치를 얻는 가장 좋은 방법입니다.

답변

내가 사용하는 또 다른 옵션은 다음과 같습니다.

this.form.controls['LinkToPreceeding'].value;

답변

내가 필요한 것을 80 % 얻 도록 해주신 @Sasxa 에게 감사드립니다 .

같은 문제에 대한 해결책을 찾고 있지만 중첩 된 양식의 경우 평소를 변경하여 해결할 수있었습니다. 

this.notelinkingForm.get('nestedForm').value

에 

this.notelinkingForm.getRawValue().nestedForm

답변

readonly대신 사용 disabled하는 경우 데이터가 양식에 포함되는 동안 여전히 편집 할 수 없습니다. 그러나 모든 경우에 가능하지는 않습니다. 예를 들어 라디오 버튼과 확인란에는 사용할 수 없습니다. MDN 웹 문서를 참조하십시오 . 이 경우 여기에 제공된 다른 솔루션을 신청해야합니다.

답변