我想使用angular.js阻止多个表单提交.这个问题与这个问题有关.
当用户点击表单提交按钮时,提交按钮的值/标签应更改为"正在加载...",按钮的状态将设置为禁用,并且应以正常方式触发提交事件,从而导致提交对服务器的调用.这样用户会看到以下效果:
立即:提交按钮值更改为"正在加载..."并被禁用
一旦服务器响应:用户获得服务器请求的结果(而服务器响应在没有角度干预的情况下处理)
我创建了这个插件以显示我的意思.我的问题与这一行有关:elm.attr('disabled',true);.这不仅会禁用该按钮,还会阻止传播提交事件.因此,我得到一个禁用按钮(所需的结果),但表单没有被提交(不希望的结果).
如果您评论/取消注释此行,您可以看到更改的行为: elm.attr('disabled',true);
知道怎么改变这个吗？
在DRY主体之后,我想写一个按钮指令,它在$ http类的持续时间内保持按钮被禁用.
我想这样做是为了禁止用户多次单击按钮,但我无法考虑如何在指令中获取函数承诺状态,因为函数驻留在$ scope
该场景非常通用,按钮ng-click确实调用了一个函数,该函数又进行$ http调用.用户点击:按钮应该被禁用,只有在$ http调用解决后才能启用,无论是成功还是失败.
在服务器上处理“长”请求时，我在禁用按钮时遇到问题。
我们的应用程序运行在 Java Spring/Tomcat 后端，前端使用 AngularJS。我们的用户可以点击“导出”按钮来获取一些统计数据的 CSV 文件。问题是这个文件是通过调用这样的 URL 在服务器端生成的：
<a ng-href="/exports?id={{the_id}}>Export</a>
并且响应类型是：application/octet-stream。
请求工作正常，但可能有点慢。我想在文件生成时禁用该按钮，并在“保存文件”窗口出现后启用它。但是我无法通过简单的“同步”href 拦截这些事件。
我尝试异步处理请求，$http.get()但这一次，我不知道如何在处理完成后以相同的方式向用户提供文件（例如，Mega 为已经使用过它的人提供的方式）。
提前致谢 ！
PS：我知道，使处理速度更快是另一种解决方案......但现在不可能，而不是重点:)
编辑：问题得到了解决，感谢 Ed 的回答，并进行了一些修改（我不知道这样做是否是“好”的方法，但实际上它完全按照我想要的方式对我有用）。
$scope.processExport = function(campaignId) {
if (!$scope.exportProcessing) {
$scope.exportProcessing = true;
$http.get('my_generating_url').success(function(response) {
$scope.exportProcessing = false;
$window.location.href = 'url_to_retrieve_the_file_with_' + response.fileName;
}).error(function() {
$scope.exportProcessing = false;
});
}
}
以及相应的 HTML：
<button ng-click="processExport(the_id)" ng-disabled="exportProcessing">Export</button>
并且my_generating_url只是在成功生成后返回文件名。
当我想从我的页面删除记录时,我需要在删除之前显示确认消息.为此,我使用了锚并ng-click='delete()'删除了这样的行.在这里,用户可以多次点击锚点.这是一个严重的问题,因为确认弹出窗口会多次呈现.我的例子是一个样本.在我的项目中,我遇到了太多这样的问题.我想阻止多次点击扩展ng-click.
Angular控制器中的DOM操作似乎是错误的.但这不是没有一些头痛:)
我有一个按钮,在ng-click时,它将在后台执行异步请求.在异步请求期间,我希望禁用所有按钮(可能还有一些页面上的元素),单击按钮可以播放加载图标.
这样做最干净的方法是什么？