ngblur 和 enter 事件:为什么在 enter 键上有两个 http 调用?
ngblur and enter event : why on enter key two http calls go?
我有一个表单,其中有 enter-key
新闻事件和 ng-blur
。这就像当用户输入某些内容并单击其他地方时,如果用户输入某些内容并按回车键,则提交表单类似地提交表单并且 API 调用开始。
问题陈述
它在 ng-blur
上工作正常,只有一个调用转到 API。但是当我尝试使用按键事件时,有两个调用。这就是显示两条成功消息的原因。我不知道为什么,但它就是那样。
表格
input ng-model="cusBoard.boardData.musicalWorkName"
id="superTitleInput" class="title-edit-input superTitle-input" type="text"
maxlength="50"
my-key-enter="cusBoard.updateInfo()"
ng-blur="cusBoard.updateInfo()">
My-key-enter 指令
app.directive('myKeyEnter', function () {
return {
controller: 'SignInController',
link: function (scope, elements, attrs) {
elements.bind('keydown keypress', function (event) {
if (event.which === 13) {
scope.$apply(function () {
scope.$eval(attrs.myKeyEnter);
});
event.preventDefault();
}
});
}
}
控制器功能
function updateInfo(){
editable('superTitle',0);
var params = {
superTitle : cusBoard.boardData.musicalWorkName,
boardId : cusBoard.boardData._id
};
CastingBoard.updateSuperTitle(params).then(function (res) {
if (res.msgCode === '405') {
$mdToast.show($mdToast.simple().textContent("Board title updated successfully.").position('bottom right'));
}
});
}
您同时绑定了 keydown
和 keypress
事件:
elements.bind('keydown keypress', function (event) {
回车键会触发两个事件,因此处理程序会执行两次。
随便选一个。
我有一个表单,其中有 enter-key
新闻事件和 ng-blur
。这就像当用户输入某些内容并单击其他地方时,如果用户输入某些内容并按回车键,则提交表单类似地提交表单并且 API 调用开始。
问题陈述
它在 ng-blur
上工作正常,只有一个调用转到 API。但是当我尝试使用按键事件时,有两个调用。这就是显示两条成功消息的原因。我不知道为什么,但它就是那样。
表格
input ng-model="cusBoard.boardData.musicalWorkName"
id="superTitleInput" class="title-edit-input superTitle-input" type="text"
maxlength="50"
my-key-enter="cusBoard.updateInfo()"
ng-blur="cusBoard.updateInfo()">
My-key-enter 指令
app.directive('myKeyEnter', function () {
return {
controller: 'SignInController',
link: function (scope, elements, attrs) {
elements.bind('keydown keypress', function (event) {
if (event.which === 13) {
scope.$apply(function () {
scope.$eval(attrs.myKeyEnter);
});
event.preventDefault();
}
});
}
}
控制器功能
function updateInfo(){
editable('superTitle',0);
var params = {
superTitle : cusBoard.boardData.musicalWorkName,
boardId : cusBoard.boardData._id
};
CastingBoard.updateSuperTitle(params).then(function (res) {
if (res.msgCode === '405') {
$mdToast.show($mdToast.simple().textContent("Board title updated successfully.").position('bottom right'));
}
});
}
您同时绑定了 keydown
和 keypress
事件:
elements.bind('keydown keypress', function (event) {
回车键会触发两个事件,因此处理程序会执行两次。
随便选一个。