作者:瑶看瀑布挂前川 | 来源:互联网 | 2023-05-29 10:40
从Angular的文档中可以得出,ngSubmit是提交表单的首选方式。所有未完成的操作将立即完成,并且$submitted
还将设置标志。聆听ngClick
事件并不会产生相同的效果。
现在,我需要提交一个包含所有ngSubmit
方法优点的热键表单。因此,我需要某种方式来触发标准提交工作流。
我尝试submit()
使用DOM表单,但是它起作用了,但是附加到scope的angular的form对象不包含对DOM表单的引用,因此我需要通过jqLite访问它:
var frm = angular.element('#frmId');
frm.submit();
我不喜欢这种在控制器代码中访问DOM的解决方案,因此我创建了一条指令:
function wuSubmit() {
return {
require: 'form',
restrict: 'A',
link: function(scope, element, attributes) {
var scope = element.scope();
if (attributes.name && scope[attributes.name]) {
scope[attributes.name].$submit = function() {
element[0].submit();
};
}
}
};
}
用$submit
方法扩展表单对象。
两种变体由于未知原因均无法使用。form.submit()
尝试发送数据,但不会阻止默认操作。
更新1
事实证明Angular侦听具有的元素的click事件type="input"
。
最终,我决定触发该元素的click事件:
wuSubmit.$inject = ['$timeout'];
function wuSubmit($timeout) {
return {
require: 'form',
restrict: 'A',
link: function (scope, element, attributes) {
var submitElement = element.find('[type="submit"]').first();
if (attributes.name && scope[attributes.name]) {
scope[attributes.name].$submit = submit;
}
function submit() {
$timeout(function() {
submitElement.trigger('click');
});
}
}
};
}
有没有针对此功能的现成解决方案?