Question

当正在处理角度2的表格时，我遇到了问题。使用以下表格时，我的提交不起作用：

<form #addForm="ngForm" (ngSubmit)="add()">
  <div class="input-group">
    <span class="input-group-btn">
      <button [class.disabled]="!addForm.valid" type="submit"
              class="btn btn-primary col-xs-12">+</button>
    </span>
    <input required name="name" type="text" class="form-control" placeholder="name" [(ngModel)]="newAlbum.name">
  </div>
</form>

但是通过向按钮添加(click)="add()"，我可以按Enter键提交表单。任何人都可以向我解释这一点。

Answer 1

在onSubmit调用中，您需要传递i：e onSubmit(myForm)

形式

我认为您在模型和模板驱动的表单之间感到困惑。请先完成它们。

Answer 2

如果找到解决方案：

<button 
  [disabled]="!addForm.valid"
  (click)="add()">+</button>

通过添加[disabled]绑定，当表单不正确时，该按钮将自行禁用。它可能不是正确的实现方式，但确实有效。如果有人有更好的解决方案，请提及它，但现在这个问题已经解决了。

提交Angular 2表单

2 个答案: