Angular 1 не принимает событие onchange (), он принимает только событие ng-change ().

Angular 2, с другой стороны, принимает оба события (change) и (ngModelChange), которые, похоже, делают одно и то же.

Какая разница?

какой из них лучше по производительности?

ngModelChange:


против изменить:


Ответы (5)

(изменение) событие, привязанное к классическому событию изменения ввода.

https://developer.mozilla.org/en-US/docs/Web/Events/change

Вы можете использовать (изменить) событие, даже если у вас нет модели на входе как


(ngModelChange) - это @ Output директивы ngModel. Он срабатывает при изменении модели. Вы не можете использовать это событие без директивы ngModel.

https://github.com/angular/angular/blob/master/packages/forms/src/directives/ng_model.ts#L124

По мере того, как вы обнаружите больше в исходном коде, (ngModelChange) испускает новое значение.

https://github.com/angular/angular/blob/master/packages/forms/src/directives/ng_model.ts#L169

Значит, у вас есть возможность такого использования:


modelChanged (newObj) {
    // делаем что-то с новым значением
}

По сути, кажется, что нет большой разницы между двумя, но события ngModel получают силу, когда вы используете [ngValue].

 
dataChanged (newObj) {
    // здесь идет объект как параметр
}

предположим, что вы попробуете то же самое без «ngModel things»


изменено (e) {
    // событие приходит как параметр, вам нужно будет найти selectedData вручную
    // используя e.target.data
}

В Angular 7 (ngModelChange) = "eventHandler ()" будет срабатывать перед значением, привязанным к [(ngModel)] = "value" изменяется, в то время как (change) = "eventHandler ()" срабатывает после изменяется значение, привязанное к [(ngModel)] = "value" .

По моему опыту (изменение) и (ngModelChange) имеет два разных использования.

  1. (ngModelChange) срабатывает при отображении HTML, пользователь изменил значение этого элемента.

  2. (изменение) срабатывает, когда пользователь изменяет значение и оставляет элемент в фокусе.

Использование:

  1. (ngModelChange): когда у вас есть критические вещи, которые зависят от HTML, любой тип изменений, которые вам нужно обработать.
  2. (изменение): когда вам нужно обрабатывать только изменения значений, сделанные пользователем.

Примечание: будьте осторожны при использовании (ngModelChange), потому что иногда он вызывает проблему с максимальным стеком вызовов, и ваша форма застревает.

Как я нашел и написал в другой теме - это относится к angular <7 (не уверен, как в 7+)

На будущее

нам нужно заметить, что [(ngModel)] = "hero.name" - это всего лишь сокращенный вариант, от которого можно избавиться: [ngModel] = "hero.name "(ngModelChange) =" hero.name = $ event ".

Итак, если мы уберем код от сахара, мы получим:

Источник: https://www.w3schools.com/jsref/event_onchange.asp

2 - Как указано ранее, (ngModelChange) привязан к переменной модели, привязанной к вашему входу.

Итак, моя интерпретация:

  • (изменение) срабатывает, когда пользователь изменяет ввод
  • (ngModelChange) срабатывает при изменении модели, независимо от того, следует ли это за действием пользователя или нет

2022 WebDevInsider