代码之家 › 专栏 › 技术社区 › d-man

角度5重置嵌套窗体

angular5 forms angular

-1

d-man · 技术社区 · 6 年前

角度5

我有嵌套表单,就像下面我不得不嵌套表单一样,有人能帮助我如何重置嵌套表单。

<form #myForm="ngForm">
    <div *ngFor="let i of arr">
        <form>
            <input #input="ngModel" type="text" [(ngModel)]="i" required>
            <div *ngIf="input.errors.required"> required </div>
        </form>
    </div>
</form>

<button (click)="submit()">Submit</button>
<button (click)="resetForm(myForm)"></button>

组成部分

...
resetForm(form: ngForm){
  form.reset();
}
...

1 回复 | 直到 6 年前

Chris Gomez 6 年前

我认为一个解决方案是 FormGroup

<form #myForm="ngForm" [formGroup]="myFormGroup">
    <div *ngFor="let i of arr">
        <form>
            <input #input="ngModel" type="text" [(ngModel)]="i" required>
            <div *ngIf="input.errors.required"> required </div>
        </form>
    </div>
</form>

<button (click)="submit()">Submit</button>
<button (click)="resetForm()"></button>

在你的组件中

...
resetForm(){
  this.myFormGroup.reset();
}
...

这就可以做到这一点,并重新设置两种形式。

推荐文章

Natalie Smyth · 隐藏类只在我试图切换的两个部分中的一个部分上工作

1 年前

Maddison · 如果用户选择18岁以下,则需要表单重定向用户

2 年前

Maddison · 拆分用户全名并将名字传递给下一个表单pae

2 年前

Santiago Cuartas Rmrz · 使用Javascript根据密码输入长度启用/禁用按钮

2 年前

BABO SAMMO NG · 如何延迟javascript警报直到操作完成

2 年前

Germán · 单击提交时,如果文本字段错误匹配,则显示错误提示

2 年前

Shikhor Khan · 如何从下面的代码中删除提交后的表单值?

2 年前

Adheed nihal · 如果在jquery中超过了文件限制,如何清除用户上传的图像

2 年前

inyourface3445 · 更改表单中的值会导致延迟

2 年前

Filippo · 无法输入:焦点覆盖默认设置

2 年前