在Angular中,可以使用FormGroup
和FormControl
来创建响应式表单,并且可以使用getRawValue()
方法来获取嵌套控件的原始状态。
以下是一个简单的示例代码,展示了如何创建一个嵌套的响应式表单,并获取嵌套控件的原始状态:
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl } from '@angular/forms';
@Component({
selector: 'app-example',
template: `
`,
})
export class ExampleComponent implements OnInit {
myForm: FormGroup;
ngOnInit() {
this.myForm = new FormGroup({
nestedGroup: new FormGroup({
nestedControl: new FormControl('Initial Value'),
}),
});
}
onSubmit() {
// 获取嵌套控件的原始状态
const nestedControlValue = this.myForm.get('nestedGroup.nestedControl').getRawValue();
console.log('Nested Control Value:', nestedControlValue);
}
}
在上面的代码中,创建了一个嵌套的响应式表单,其中nestedGroup
是一个FormGroup
,包含一个nestedControl
的FormControl
。在onSubmit()
方法中,使用getRawValue()
方法获取nestedControl
控件的原始值,并将其打印到控制台。
请注意,getRawValue()
方法返回的是一个纯JavaScript对象,只包含控件的原始值,不包含任何Angular特定的元数据。
希望这个示例能帮助到你!