Как AngularJS внутренне захватывает такие события, как "onclick", "onchange"?

Я использовал "ng-model" во входном элементе и заметил этот элемент с инспектором хрома. Но каждое свойство onxxx (включая onchange) входного элемента было нулевым. Затем, как AngularJS поймает событие "onchange", вызванное пользовательским вводом?

Ответ 1

Если на вкладке "Слушатели событий Chrome" вы просматриваете стандартный элемент ввода текста (с прикрепленной ng-моделью), вы увидите, что в нем есть два приемника событий: $destroy и input.

Angular, по умолчанию прослушивает событие input, и, если он не поддерживается браузером, он вернется к событиям keydown + change.

События привязываются с помощью метода привязки jQlite (если у вас также не включен полный jQuery, и в этом случае его метод связывания возьмет верх).

Пример элемента ввода, который вы можете проверить самостоятельно, находится на странице input [email].

Точная строка в Angular source (v1.2.0rc1), ответственная за обработку входного события.

Ответ 2

Вы можете присоединить прослушиватели событий к любому DOM node, используя:

node.addEventListener(eventName, listenerMethod, useCapture)

Пока вы назначили метод node.onchange, используя addEventListener, вы должны присоединить прослушиватель событий к событию "change" или 'click'.

Смотрите: https://developer.mozilla.org/en-US/docs/DOM/EventTarget.addEventListener