Как обнаружить удаленный элемент в $ scope. $ Watch?

Question

Можно ли обнаружить удаленный или добавленный элемент через $ scope. $ Watch?

Пожалуйста, смотрите пример ниже:

var data = [{id: 1}, {id: 2}, {id: 3}]; 

$scope.$watch(function() {return data}, function (newValue, oldValue) { 
    console.log(newValue, oldValue); 
    // I want to detect removing or adding here: 
    // var removedItem = ...? 
    // var addedItem = ...? 
}, true) 

data.push({id: 4}); 
data.splice(0, 1); 

Благодарность

Answer 1

Этот код отлично работает для меня

x = [] 

$rootScope.$watch((-> x), (newValue, oldValue) -> 

    changed = newValue.filter((item, index) -> 
     return oldValue[index] and angular.equals(item, oldValue[index]) is no 
    ) 
    added = newValue.filter((item, index) -> 
     return not oldValue[index] 
    ) 
    removed = oldValue.filter((item, index) -> 
     return not newValue[index] 
    ) 
    console.log('x', changed, added, removed) 
, yes) 

Answer 2

AngularJS является dirtychecking этой коллекции, и так как вы делаете это так быстро, ваш журнал консоль не будет работать даже до того секунды.splice() изменение.

Попробуйте это, добавьте $timeout(function() { } и разместите там код .splice(), и теперь обратите внимание на содержимое console.log.

Например:

// Make sure to add the $timeout dependency 
$timeout(function() { 
    data.splice(0, 1); 
}, 1000); 

Теперь вы сможете сохранить вещи в тех переменных, которые вы сделали, и обратите внимание, если есть какое-либо различие.

Вот ссылка jsfiddle для справки, вы можете увидеть различия в объектах. jsFiddle demo

Answer 3

Не существует прямого способа достичь этого. Вероятно, вы можете использовать приведенный ниже результат.

// Для отображения newValue. var diff = $ (newValue) .not (oldValue) .get();

// Чтобы отобразить oldValue. var diff = $ (oldValue) .not (newValue) .get();

Answer 4

Вы можете использовать $watchCollection.

Из документов:

код [...] Коллекция наблюдается через стандартный $watch работы и рассматривается на каждом вызове $digest(), чтобы увидеть, если какие-либо элементы, которые были добавлены, удалены или перемещены.