javascript - ngblur 并输入事件 : why on enter key two http calls go?

Question

我有一个表单，其中有 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();
            }
        });
    }
}

Controller 功能

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'));
        }
    });   
}

Answer 1

您同时绑定(bind)了 keydown 和 keypress 事件:

        elements.bind('keydown keypress', function (event) {

这两个事件都会因 Enter 键而触发，因此处理程序会执行两次。

随便选一个。