gpt4 book ai didi

angular - 设置 Formgroup 有效或无效 angular 7

转载 作者:行者123 更新时间:2023-12-03 22:31:04 26 4
gpt4 key购买 nike

我有一个表单,我需要将字段设置为有效或无效,因为我想编辑用户,但按钮保持禁用状态

编辑组件

ngOnInit() {
this.getForm();
this.getRole();
console.log(this.formGroup.valid)
}

getForm() {
this.formGroup = this.formBuilder.group({
name: ['', Validators.required],
label: ['', Validators.required],
});
}

当我进入页面编辑时,我希望能够将按钮设置为无效的表单
<button type="submit" mat-button color="primary" [disabled]="!formGroup.valid">Alterar</button>

例如
if(user) {
this.formGroup (invalid)
} else {
this.formGroup (valid)
}

enter image description here

这是我要编辑项目的页面,但即使填写了该字段,表单组也无效,为什么?

最佳答案

HTML:

<form [formGroup]="form" fxLayout="column" fxLayoutAlign="center center" fxFlex="50">
<mat-form-field>
<input matInput placeholder="Input" formControlName="name">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Input" formControlName="label">
</mat-form-field>
<button type="submit" mat-button color="primary" [disabled]="!form.valid">Alterar</button>
</form>

TS:
form: FormGroup;
constructor(private fb: FormBuilder) {
this.form = this.fb.group({
name: ['', Validators.required],
label: ['', Validators.required],
});
}
ngOnInit() {
this.form.patchValue({
'name': 'Abhishek',
'label': 'Dubey'
});
}

我认为你没有必要写 if 和 else 条件,因为如果你以正确的方式设置值, react 形式会给你表单状态。

关于angular - 设置 Formgroup 有效或无效 angular 7,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53772749/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com