angular - 按下(单击)按钮时调用 (ngSubmit)

标签 angular typescript

我的 Angular2 表单组件上有两个按钮。该按钮正在执行自己的功能。

  1. 按钮提交:将所有值提交给 API。
  2. 按钮添加。 : 将对象推送到数组。

这两个方法在这里...

onSubmit() {
this.submitted = true;
this.model.service_requests = this.modelJobServices;
this.onCreateJob();
}

addJobService(modelJobService :Jobservice){
let modelJobServiceLocal = new Jobservice(modelJobService.service_id,modelJobService.service_note,modelJobService.status)
this.modelJobServices.push(modelJobServiceLocal);
}

我的 Component.html 结构如下

<form #jobRegistrationForm="ngForm" (ngSubmit)="onSubmit()">
......
......
......
<button class="flat btn-primary form-control" id="btn_add" (click)="addJobService(modelJobService)"> ADD SERVICE </button>
....
....
....
<button (submit)="onSubmit()" [disabled]="!jobRegistrationForm.form.valid" class="flat form-control col-md-4 btn-primary">{{BUTTON_TEXT}}</button>

当我按下 (click) 按钮时,表单被提交给 API 调用。但是我没有在 (click) 按钮事件上调用 onSubmit()

最佳答案

默认情况下,表单内的按钮变为 type="submit"

明确地让它们成为普通按钮:

<button type="button"

关于angular - 按下(单击)按钮时调用 (ngSubmit),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40968069/

相关文章:

javascript - 带有 angular2 和 grunt 错误 TS2304 : Cannot find name 的 typescript

Angular Universal 不适用于 Angular Google map

angular - 如何将 Angular Material 自动完成中的值分配给组件中的变量?

javascript - Angular 2+ : Internet Explorer: Unable to get property 'call' of undefined or null reference

javascript - 在 block 外使用值时返回 null

angular - 找不到本地 "typescript"包。 "@ngtools/webpack"包 Angular 2

javascript - 如何在 Angular 中使用 Datatables.Net 创建自定义打印预览屏幕

angular - angular4/typescript 中的 document.getElementById 替换?

javascript - 如何从 typescript 中的字符串中减去日?

angular - Http 获取 + NgFor