javascript - 如何处理单个 HTML 页面中的表单

标签 javascript html angularjs

我的疑问如下,我有一个静态 HTML 页面(Login.html),其中有 3 个表单

  1. 登录表单
  2. 创建帐户表单
  3. 忘记密码表单

当用户在登录表单中输入正确的用户电子邮件 ID 和密码时,该表单需要将其定向到不同的 HTML 页面,即仪表板.html。当用户选择忘记密码表单时,该表单将要求用户输入其电子邮件 ID,一旦用户单击“提交”按钮,忘记密码表单应将其重定向到 Login.html 文件中的登录表单。这两个表单都位于单个 Html 页面中。

我的问题是如何使用 Angular JS 在单个 HTML 页面中从一个表单重定向到另一个表单,以及如何在 Angular JS 中从一个页面重定向到另一个页面。我找不到关于这个问题的好的教程。有人可以帮我解决这个问题吗?

最佳答案

如果您需要在单页 html 应用程序中的表单之间进行重定向,则需要使用路由。您的选择是 ngRoute,它是 AngularJS 的一部分,但是一个单独的模块,以及来自 AngularUI 人员的 ui-router,我会推荐它。

我假设您正在使用表单上的 ngSubmit 指令来处理登录表单提交?如果是这样,请在分配给 ngSubmit 的范围函数中通过任何需要的方式检查用户名/密码。如果凭据有效,请使用路由器或 $location 服务将用户重定向到仪表板。忘记密码页面的链接是一个带有 ngHref 或 ui-href 的简单链接,具体取决于您使用的路由器。

您的 HTML 页面将显示在为 View 预留的页面部分中(再次检查您正在使用的路由器)。 HTML 页面应该是部分页面,而不是完整的 HTML 页面,因为它们将被插入到单页应用程序的主页中。

希望有帮助。

关于javascript - 如何处理单个 HTML 页面中的表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31144084/

相关文章:

javascript - 处理 $http AngularJS 返回数据

javascript - Angularjs - 将真/假显示为是/否

javascript - Chrome 插件读取硬盘上的文本文件并替换文本框内容

javascript - 将 x.innerHTML 设置为 INPUT chop 值字符串

javascript - 如何使用 phonegap 在 iPhone 中创建联系人

jquery - 如何使用 jQuery 在悬停元素 y 时显示元素 x 并将其放在元素旁边?

javascript - 如何用jQuery控制css3动画属性 'animation-duration'?

angularjs - 使用 webpack 进行 Angular 1.5 组件单元测试

javascript - JavaScript中如何处理 float 精度?

javascript - 我如何在以编程方式创建的 JavaScript 状态之间切换?