Question

我是AngularJS的新手，现在正在学习this todo-mvc example。令我困惑的一件事是来自index.html的以下代码中ng-submit的行为：

<form id="todo-form" ng-submit="addTodo()">
    <input id="new-todo" placeholder="What needs to be done?" ng-model="newTodo" autofocus>
</form>

以下是addToDo()函数的代码：

$scope.addTodo = function () {
    var newTodo = $scope.newTodo.trim();
    if (!newTodo.length) {
        return;
    }

    todos.push({
        title: newTodo,
        completed: false
    });

    $scope.newTodo = '';
};

正如您所看到的，没有任何地方可以显示ng-submit应该对应的事件。我猜测ng-submit旨在处理enter字段的input事件。但是，我无法在official document中找到相关信息。那么，ng-submit的默认行为是什么？也就是说，我想知道在各种情况下哪些事件对应于“提交”。在这个特定的例子中，“提交”是否意味着输入输入字段？

非常感谢。

Answer 1

这是写在链接文档的顶部：

启用将角度表达式绑定到 onsubmit 事件。

<强> ----------- UPDATE -------------

在下面的评论中，您持有：

单击提交按钮时会发生
onsubmit事件

这不完全正确。

首先，让我们确定ngSubmit指令抛出的事件在angular-scenario.js中，有以下代码：

var ngSubmitDirective = ngDirective(function(scope, element, attrs) {
  element.bind('submit', function() {
    scope.$apply(attrs.ngSubmit);
  });
});

此外，如果您引用HTML 2.0规范，关于表单提交，（因此submit事件）：

当表单中只有一个单行文本输入字段时，用户代理应接受该字段中的Enter作为提交请求形式。

另外，根据Angular的代码，第15527行（取决于当前版本）：

* To prevent double execution of the handler, use only one of the {@link ng.directive:ngSubmit ngSubmit}
 * or {@link ng.directive:ngClick ngClick} directives.
 * This is because of the following form submission rules in the HTML specification:
 *
 * - If a form has only one input field then hitting enter in this field triggers form submit
 * (`ngSubmit`)
 * - if a form has 2+ input fields and no buttons or input[type=submit] then hitting enter
 * doesn't trigger submit
 * - if a form has one or more input fields and one or more buttons or input[type=submit] then
 * hitting enter in any of the input fields will trigger the click handler on the *first* button or
 * input[type=submit] (`ngClick`) *and* a submit handler on the enclosing form (`ngSubmit`)

ng-submit的默认行为是什么？

1 个答案: