AngularJS 是一个流行的前端框架，它为开发者提供了丰富的工具和功能来构建现代化的 Web 应用程序。在本文中，我们将介绍如何使用 AngularJS 来实现简单的表单提交。
HTML 表单
首先，让我们来看一下 HTML 表单的基本结构：
-- -------------------- ---- ------- ------ ------ ---------------------- ------ ----------- --------- ------------ ------ ------------------------- ------ ------------ ---------- ------------- ------- ------------------------- -------
这是一个包含两个输入字段和一个提交按钮的简单表单。当用户点击提交按钮时，浏览器将会发送一个 POST 请求，把表单数据发送到服务器。
然而，这个表单不能够直接与 AngularJS 集成。我们需要添加一些指令和控制器来处理表单提交。
AngularJS 模块和控制器
首先，我们需要创建一个 AngularJS 模块来管理我们的应用程序。在这个模块中，我们可以定义控制器、服务和指令等元素。
var app = angular.module('myApp', []);现在，我们需要创建一个控制器来处理表单提交事件。这个控制器将会被绑定到表单元素上。
app.controller('myCtrl', function($scope) {
$scope.submitForm = function() {
// 处理表单提交事件的代码将在这里实现
};
});现在，我们需要把这个控制器绑定到表单元素上。为了做到这一点，我们可以使用 ng-controller 指令。
-- -------------------- ---- ------- ----- ---------------------- ------------------------- ------ ---------------------- ------ ----------- --------- ----------- ---------------- ------ ------------------------- ------ ------------ ---------- ------------ ----------------- ------- ------------------------- -------
现在，我们已经成功地把控制器绑定到表单元素上了。当用户点击提交按钮时，AngularJS 将会调用 submitForm 函数来处理表单提交事件。
处理表单提交事件
我们已经定义了一个函数来处理表单提交事件。现在，让我们来看一下如何实现这个函数。
-- -------------------- ---- -------
------------------------ ---------------- ------ -
----------------- - ---------- -
--- ---- - -
----- ------------
------ ------------
--
----------------------------- -----
------------------------ -
-- ----------------
-- --------------- -
-- -------------
---
--
---在这个函数中，我们创建了一个包含用户输入数据的 JavaScript 对象。接下来，我们使用 AngularJS 的 $http 服务来发送 POST 请求到服务器。当服务器返回响应时，AngularJS 将会调用 then 方法。我们可以在这里处理服务器响应和错误情况。
现在，我们已经成功地实现了简单的表单提交功能。
总结
在本文中，我们介绍了如何使用 AngularJS 来实现简单的表单提交。通过添加 ng-controller 指令和控制器，我们可以轻松地管理表单事件和数据。我们还讨论了如何使用 $http 服务来发送 POST 请求，并处理服务器响应和错误情况。希望这篇文章能够为你提供有价值的学习和指导信息。
完整代码示例：
<!DOCTYPE html> <html> <head> < > 来源：[JavaScript中文网](https://www.javascriptcn.com/post/25312) ，转载请注明来源 [https://www.javascriptcn.com/post/25312](https://www.javascriptcn.com/post/25312)