конфликт при запуске последовательности кликов и просмотров событий в текстовых полях и моделях флажков в приложении Angularjs

Я делаю часы на моделях текстового поля и флажка, чтобы вызвать мою пользовательскую функцию. Поскольку я не хочу вызывать свою пользовательскую функцию внутри часов во время начальной загрузки данных, внутри часов я зависел от флага needwatch, когда вызывать мою пользовательскую функцию. Для этой цели я сохранил как флажок, так и текстовые поля внутри элемента span, и при нажатии span я делаю этот флаг needWatch истинным, так что пользовательская функция будет вызываться при изменении этой конкретной модели, так что эта пользовательская функция не будет вызываться во время начальной загрузки данных. Эта логика отлично работает для текстового поля (даже для раскрывающегося списка выбора), но не работает с флажком.

Причина в том, что для текстового поля ВСЕГДА сначала запускается его событие span ng-click, а затем запускается функция наблюдения в модели текстового поля. В то время как для флажка случайным образом сначала срабатывает его функция наблюдения, а затем срабатывает его событие span ng-click, и наоборот.

Я также хочу, чтобы для флажка ВСЕГДА сначала запускалось событие span ng-click вместо функции наблюдения за моделью. Является ли это возможным?

пожалуйста, найдите plunker и попробуйте изменить значения текстового поля и флажка.


person Madasu K    schedule 28.10.2015    source источник


Ответы (2)


Есть некоторые проблемы, которые вы не освещаете, например: - Я могу вводить текст, не нажимая на него. (Вместо этого используйте вкладку)

Так что лучше просто используйте ng-change и вам не понадобится всякая хрень needWatch. Или заставить часы работать так:

 $scope.$watch('checkboxModel', function(newval, oldval) {
   if (newval != oldval) {
       console.log('watch', newval, oldval);
   }
 }, true); 
person Petr Averyanov    schedule 28.10.2015

В Angular прослушиватели $watch передаются полужирным шрифтом newValue и oldValue для выражения watch.

Если цель состоит в том, чтобы избежать запуска пользовательской функции во время инициализации, сравните значения oldValue и newValue. Если они равны, то часы были вызваны во время инициализации и ваша пользовательская функция не должна запускаться.

Документация Angular предлагает это как стандартный способ обработки цикла инициализации: https://docs.angularjs.org/api/ng/type/$rootScope.Scope

Пример:

$scope.model = { textbox: '', checkbox: false };

$scope.$watch( 'model.textbox', function( newValue, oldValue {
    if( newValue === oldValue )
        return;

    customFunction( newValue );
});

$scope.$watch( 'model.checkbox', function( newValue, oldValue ){
    if( newValue === oldValue )
        return;

    customFunction( newValue );
});

function customFunction( value ){
    console.log( "new value: " + value );
}
person Brian    schedule 28.10.2015