Question

我在同一页面上有以下表格：

<form ng-submit="actionA()">
    <input type="text">
    <input type="submit" value="Submit">
</form>

<form ng-submit="actionB()">
    <input type="text">
    <input type="submit" value="Submit">
</form>

目前，当我提交任何一个表单时，页面会重新加载。我该如何预防呢？我知道我可以使用event.preventDefault（），但我想知道是否有一个简单的Angular解决方案。

Answer 1

根据Angular的documentation，它不应该重新加载页面

由于表单在客户端Angular应用程序中的作用与传统的往返应用程序不同，因此浏览器最好不要将表单提交转换为将数据发送到服务器的整页重新加载。相反，应该触发一些javascript逻辑来以特定于应用程序的方式处理表单提交。

出于这个原因，Angular会阻止默认操作（表单提交到服务器），除非该元素指定了action属性。

这里提供的example不会重新加载。

我有一种感觉，你的角应用程序没有自举或绑定没有绑定。

Answer 2

确保从包含组件的模块中的 @ angular / forms 导入 FormsModule ，因为如果没有它，您提交的表单将保持刷新页面并在没有记录的情况下无声地失败任何东西到控制台。

Answer 3

将按钮类型从button

更改为submit

Answer 4

这阻止了我重新加载

using

为什么Angular表单会重新加载页面？

4 个答案: