NgSubmit 不工作(按钮已经在表单内)
NgSubmit not working (button is already inside the form)
当我提交表单时,我创建的 onSubmit() 函数没有被调用。
我已经搜索过了,但其他答案大多是按钮在表单之外,而不是我的情况,也许我遗漏了什么。
HTML:
<form ng-submit="onSubmit()" [formGroup]="messageForm">
<fieldset>
<label for="name">Nome e Sobrenome</label>
<input type="text" name="name" id="name" required formControlName="name">
<label for="email">Email</label>
<input type="email" name="email" id="email" required>
<label for="tel">Telefone</label>
<input type="text" name="tel" id="tel" required>
</fieldset>
<fieldset>
<label for="message">Mensagem</label>
<textarea name="message" id="message" cols="30" rows="10" required></textarea>
<button type="submit">Enviar</button>
</fieldset>
</form>
COMPONENT.TS
export class ContatoComponent{
title="Entre em contato conosco";
messageForm = new FormGroup({
name: new FormControl(""),
email: new FormControl(""),
tel: new FormControl(""),
message: new FormControl("")
})
constructor() { }
onSubmit(){
console.log("oi")
}
}
我发现遗漏了什么!在 app.module.ts 中,我没有导入 ReactiveFormsModule。
如果有人遇到同样的问题,这里是答案:
里面 app.module.ts:
import { ReactiveFormsModule } from '@angular/forms';
imports:[
...
ReactiveFormsModule
]
我猜 ng-submit 不是 ng-submit try (ngSubmit),而是用于旧版本。
它对我有用。
只是改变
(ng-submit)="onSubmit()"
至
(ngSubmit)="onSubmit()"
当我提交表单时,我创建的 onSubmit() 函数没有被调用。 我已经搜索过了,但其他答案大多是按钮在表单之外,而不是我的情况,也许我遗漏了什么。
HTML:
<form ng-submit="onSubmit()" [formGroup]="messageForm">
<fieldset>
<label for="name">Nome e Sobrenome</label>
<input type="text" name="name" id="name" required formControlName="name">
<label for="email">Email</label>
<input type="email" name="email" id="email" required>
<label for="tel">Telefone</label>
<input type="text" name="tel" id="tel" required>
</fieldset>
<fieldset>
<label for="message">Mensagem</label>
<textarea name="message" id="message" cols="30" rows="10" required></textarea>
<button type="submit">Enviar</button>
</fieldset>
</form>
COMPONENT.TS
export class ContatoComponent{
title="Entre em contato conosco";
messageForm = new FormGroup({
name: new FormControl(""),
email: new FormControl(""),
tel: new FormControl(""),
message: new FormControl("")
})
constructor() { }
onSubmit(){
console.log("oi")
}
}
我发现遗漏了什么!在 app.module.ts 中,我没有导入 ReactiveFormsModule。 如果有人遇到同样的问题,这里是答案:
里面 app.module.ts:
import { ReactiveFormsModule } from '@angular/forms';
imports:[
...
ReactiveFormsModule
]
我猜 ng-submit 不是 ng-submit try (ngSubmit),而是用于旧版本。 它对我有用。 只是改变
(ng-submit)="onSubmit()"
至
(ngSubmit)="onSubmit()"