不调用任何函数

ng-enter with out calling any function

本文关键字：函数 任何 调用      更新时间：2023-09-26

下面的代码是待办事项列表代码的一部分。

第一行是一个输入框，它的值可以通过newTodo访问。输入框用于在待办事项列表中键入新任务。

 <input class="todoField" id="newTodoField" type="text" ng-model="newTodo" placeholder="Add New Todo" ng-enter>
    <button id="todoSubmit" class="btn btn-default" ng-click="addTodo()">Add</button>

有两种方法可以将新键入的任务名称提交给js。

1

。在输入任务名称后，只需单击代码的add按钮(按钮位于第二行)。它调用addTodo() js函数，该函数完成将键入的文本添加到待办事项列表中的工作。

2

。输入任务名称后，只需在输入框中按回车键。

疑点在于第二类方法。因为n -enter没有调用任意函数。它只是简单地写在标签的末尾。(如果代码就像ng-enter="addTodo()"一样意味着我可以清楚地理解)

甚至更多，即使ng-enter第二次没有调用任何函数方法工作得很好。ng-enter模型应该如何调用addTodo()函数。

完整的代码可在this_link中获得。完整程序的演示可在this_link

中获得。

如果这个问题是很基础的，请原谅。

疑问在于第二种方法。因为n -enter不调用任何函数。它只是简单地写在标签的末尾。(如果代码像ng-enter="addTodo()"一样，我就能清楚地理解)

坦率地说，在angular文档中没有关于ng-enter的文档，但是你可以使用指令ngEnter来工作，比如:

app.directive('ngEnter', function() {
    return function(scope, element, attrs) {
        element.bind("keydown", function(ev) {
            if(ev.which === 13) {
                scope.addTodo();
                ev.preventDefault();
            }
        });
    };
});

你能在文本框上添加一个侦听器吗?如本链接所示:EventListener输入Key

你可以得到这样的东西:

$(function(){
  document.querySelector('#newTodoField').addEventListener('keypress',function(e){
  var key = e.which || e.keyCode;
  if (key === 13) { // 13 is enter
   addTodo();
  }
 });
});
相关文章：