如何使禁用的反应形式在 Angular2 中可编辑
How to make a disabled reactive form Editable in Angular2
我正在使用下面的代码创建一个表单并将其设置为只读,我是 angular
的新手
createForm() {
this.comapnyIdentificationForm = this.fb.group({
businessName: ['', Validators.required ],
adressPrimary: '',
adressSecondary: '',
city:'',
state: '',
zipCode: '',
country: '',
companyPhone: '',
DUNS: ''
});
this.comapnyIdentificationForm.disable();
}
我需要启用它并将 post 编辑数据返回 Json :
<button type="button" (click)="EditData()" class="btn modal-btn btn-default">Edit</button>
只需使用以下代码启用您的表单。
this.comapnyIdentificationForm.enable();
得到一个json对象。使用以下代码:
this.comapnyIdentificationForm.value;
要用后端数据填写您的表单,请使用以下代码:
this.comapnyIdentificationForm.patchValue(json数据);
你也可以使用指令
@Directive({
selector: '[enableControl]'
})
export class EnableControlDirective {
@Input() set enableControl( condition : boolean ) {
if (condition)
this.ngControl.control.enable();
else
this.ngControl.control.disable();
}
constructor(private ngControl : NgControl ) {}
}
//use
<input class="form-control " [enableControl]="condition">
我正在使用下面的代码创建一个表单并将其设置为只读,我是 angular
的新手createForm() {
this.comapnyIdentificationForm = this.fb.group({
businessName: ['', Validators.required ],
adressPrimary: '',
adressSecondary: '',
city:'',
state: '',
zipCode: '',
country: '',
companyPhone: '',
DUNS: ''
});
this.comapnyIdentificationForm.disable();
}
我需要启用它并将 post 编辑数据返回 Json :
<button type="button" (click)="EditData()" class="btn modal-btn btn-default">Edit</button>
只需使用以下代码启用您的表单。
this.comapnyIdentificationForm.enable();
得到一个json对象。使用以下代码:
this.comapnyIdentificationForm.value;
要用后端数据填写您的表单,请使用以下代码: this.comapnyIdentificationForm.patchValue(json数据);
你也可以使用指令
@Directive({
selector: '[enableControl]'
})
export class EnableControlDirective {
@Input() set enableControl( condition : boolean ) {
if (condition)
this.ngControl.control.enable();
else
this.ngControl.control.disable();
}
constructor(private ngControl : NgControl ) {}
}
//use
<input class="form-control " [enableControl]="condition">