Як я ігнорую початкове навантаження під час перегляду змін моделі в AngularJS?

У мене є веб-сторінка, яка служить редактором для однієї сутності, яка є глибинним графіком у властивості $ range.fieldcontainer. Після отримання відповіді від мого API REST (через $ ресурс) я додаю годинник до «fieldcontainer». Я використовую цей годинник, щоб визначити, чи сторінка / сутність "брудна". Зараз я змушую відскокнути кнопку збереження, але дуже хочу зробити кнопку збереження невидимою, поки користувач не забруднить модель.

Що я отримую, це один пусковий механізм годинника, який, на мою думку, відбувається, тому що призначення .fieldcontainer = ... відбувається відразу після того, як я створю свій годинник. Я думав просто використати властивість "dirtyCount" для поглинання початкової помилкової тривоги, але це відчуває себе дуже хакітним ... і я зрозумів, що має бути "кутовий ідіоматичний" спосіб вирішення цього питання - я не єдиний використовуючи годинник для виявлення брудної моделі.

Ось код, де я встановив годинник:

 $scope.fieldcontainer = Message.get({id: $scope.entityId },
            function(message,headers) {
                $scope.$watch('fieldcontainer',
                    function() {
                        console.log("model is dirty.");
                        if ($scope.visibility.saveButton) {
                            $('#saveMessageButtonRow').effect("bounce", { times:5, direction: 'right' }, 300);
                        }
                    }, true);
            });

Я просто думаю, що для цього повинен бути більш чистий спосіб, ніж захист коду "забруднення інтерфейсу користувача" за допомогою "if (dirtyCount> 0)" ...

встановити прапор перед початковим завантаженням,

var initializing = true

і тоді, коли запускається перший $ watch, робіть

$scope.$watch('fieldcontainer', function() {
  if (initializing) {
    $timeout(function() { initializing = false; });
  } else {
    // do whatever you were going to do
  }
});

Прапор буде зірвано лише наприкінці поточного циклу дайджесту, тому наступна зміна не буде заблокована.

Коли перший слухач викликається, старе значення та нове значення будуть ідентичними. Тому просто зробіть це:

$scope.$watch('fieldcontainer', function(newValue, oldValue) {
  if (newValue !== oldValue) {
    // do whatever you were going to do
  }
});

Це власне так, як кутові документи рекомендують поводитися з ним :

Після того, як спостерігач зареєстрований в області застосування, слухач fn викликається асинхронно (через $ evalAsync), щоб ініціалізувати спостерігача. У рідкісних випадках це небажано, оскільки слухач викликається, коли результат watchExpression не змінився. Щоб виявити цей сценарій у fn listener, ви можете порівняти newVal та oldVal. Якщо ці два значення однакові (===), слухач викликався через ініціалізацію

Я усвідомлюю, що на це питання отримали відповідь, проте в мене є пропозиція:

$scope.$watch('fieldcontainer', function (new_fieldcontainer, old_fieldcontainer) {
    if (typeof old_fieldcontainer === 'undefined') return;

    // Other code for handling changed object here.
});

Використання прапорів працює, але має трохи кодового запаху , не думаєте?

Під час початкового завантаження поточних значень старе значення значення не визначається. Тож наведений нижче приклад допомагає вам виключити початкові навантаження.

$scope.$watch('fieldcontainer', 
  function(newValue, oldValue) {
    if (newValue && oldValue && newValue != oldValue) {
      // here what to do
    }
  }), true;

Щойно дійсний стан нового val:

$scope.$watch('fieldcontainer',function(newVal) {
      if(angular.isDefined(newVal)){
          //Do something
      }
});