如何将表格设置为原始?
How to set a form as pristine?
- 正在编辑表示实体状态的表单(变脏)
- 正在提交表单,实体状态现在与表单状态对齐,这意味着现在应将表单设置为原始状态。
我们该怎么做?
ng1 中有 $setPristine()
。
顺便说一句,我说的是 ControlGroup
类型的表格。
更新
在新的表单模块中,这一点得到了很大改进。
AbstractControl
,大多数形式 classes 的基础 class 提供
markAsTouched({onlySelf}?: {onlySelf?: boolean}) : void
markAsUntouched({onlySelf}?: {onlySelf?: boolean}) : void
markAsDirty({onlySelf}?: {onlySelf?: boolean}) : void
markAsPristine({onlySelf}?: {onlySelf?: boolean}) : void
markAsPending({onlySelf}?: {onlySelf?: boolean}) : void
以及其他几种新方法
disable({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void
enable({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void
setValue(value: any, options?: Object) : void
patchValue(value: any, options?: Object) : void
reset(value?: any, options?: Object) : void
updateValueAndValidity({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void // (old)
setErrors(errors: {[key: string]: any}, {emitEvent}?: {emitEvent?: boolean}) : void
原创
目前不支持。参见 https://github.com/angular/angular/issues/5568 and https://github.com/angular/angular/issues/4933。通常的解决方法是重新创建表单以获得原始表单。
class MyComp {
form = new FormGroup({
first: new FormControl('Nancy'),
last: new FormControl('Drew')
});
}
reset() {
this.form.reset(); // will reset to null
// this.form.reset({first: 'Nancy', last: 'Drew'}); -- will reset to value specified
}
https://github.com/angular/angular/pull/9974
这将出现在 rc5 或更高版本中。
有 markAsPristine
方法(目前似乎没有记录,但可以在这里找到:https://github.com/angular/angular/blob/53f0c2206df6a5f8ee03d611a7563ca1a78cc82d/tools/public_api_guard/forms/index.d.ts#L42)。
基本上,this.form.markAsPristine()
会如您所愿。
- 正在编辑表示实体状态的表单(变脏)
- 正在提交表单,实体状态现在与表单状态对齐,这意味着现在应将表单设置为原始状态。
我们该怎么做?
ng1 中有 $setPristine()
。
顺便说一句,我说的是 ControlGroup
类型的表格。
更新
在新的表单模块中,这一点得到了很大改进。
AbstractControl
,大多数形式 classes 的基础 class 提供
markAsTouched({onlySelf}?: {onlySelf?: boolean}) : void
markAsUntouched({onlySelf}?: {onlySelf?: boolean}) : void
markAsDirty({onlySelf}?: {onlySelf?: boolean}) : void
markAsPristine({onlySelf}?: {onlySelf?: boolean}) : void
markAsPending({onlySelf}?: {onlySelf?: boolean}) : void
以及其他几种新方法
disable({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void
enable({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void
setValue(value: any, options?: Object) : void
patchValue(value: any, options?: Object) : void
reset(value?: any, options?: Object) : void
updateValueAndValidity({onlySelf, emitEvent}?: {onlySelf?: boolean, emitEvent?: boolean}) : void // (old)
setErrors(errors: {[key: string]: any}, {emitEvent}?: {emitEvent?: boolean}) : void
原创
目前不支持。参见 https://github.com/angular/angular/issues/5568 and https://github.com/angular/angular/issues/4933。通常的解决方法是重新创建表单以获得原始表单。
class MyComp {
form = new FormGroup({
first: new FormControl('Nancy'),
last: new FormControl('Drew')
});
}
reset() {
this.form.reset(); // will reset to null
// this.form.reset({first: 'Nancy', last: 'Drew'}); -- will reset to value specified
}
https://github.com/angular/angular/pull/9974
这将出现在 rc5 或更高版本中。
有 markAsPristine
方法(目前似乎没有记录,但可以在这里找到:https://github.com/angular/angular/blob/53f0c2206df6a5f8ee03d611a7563ca1a78cc82d/tools/public_api_guard/forms/index.d.ts#L42)。
基本上,this.form.markAsPristine()
会如您所愿。