簡體   English   中英

ng-submit的默認行為是什么?

[英]What is the default behavior of ng-submit?

我是AngularJS的新手,現在正在學習這個todo-mvc示例 讓我感到困惑的是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旨在處理input字段的enter事件。 但是,我在官方文檔中找不到相關信息。 那么, ng-submit的默認行為是什么? 即,我想知道在各種情況下哪些事件對應於“提交”。 在此特定示例中,“提交”是否意味着輸入了輸入字段?

非常感謝你。

這寫在您作為鏈接放置的文檔的頂部:

使綁定角度表達式綁定到onsubmit事件。

----------- -------------更新

在下面的評論中,您持有:

單擊提交按鈕時發生onsubmit事件

那是不正確的。

首先,讓我們確定ngSubmit指令引發的事件。
angular-scenario.js ,有以下代碼:

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

此外,如果您參考HTML 2.0規范,請參閱有關Form Submission的內容 (因此, 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`)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM