在Angular中,可以使用setValue
或patchValue
方法来设置表单控件的默认值。
以下是一个示例解决方法:
import { Component } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-your-component',
templateUrl: './your-component.component.html',
styleUrls: ['./your-component.component.css']
})
export class YourComponent {
form: FormGroup;
constructor(private formBuilder: FormBuilder) {
this.form = this.formBuilder.group({
name: ['Default Name'],
email: ['Default Email']
});
}
}
通过上述方法,无论是使用setValue
还是patchValue
方法来设置控件的值,都会在初始加载时使用控件的默认值。例如,如果要动态设置控件的值,可以在组件的ngOnInit
生命周期钩子中使用patchValue
方法:
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-your-component',
templateUrl: './your-component.component.html',
styleUrls: ['./your-component.component.css']
})
export class YourComponent implements OnInit {
form: FormGroup;
constructor(private formBuilder: FormBuilder) {
this.form = this.formBuilder.group({
name: ['Default Name'],
email: ['Default Email']
});
}
ngOnInit() {
// Set control's value dynamically
this.form.patchValue({
name: 'New Name',
email: 'new@email.com'
});
}
}
在上述示例中,name
和email
控件的默认值为Default Name
和Default Email
。然后,在ngOnInit
方法中使用patchValue
方法将name
控件的值设置为New Name
,email
控件的值设置为new@email.com
。