如何检测 $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

AngularJS 正在对这个集合进行脏检查，由于您做得太快了，您的控制台日志甚至运行直到秒 .splice()变化。

试试这个，添加一个 $timeout(function () { } 并将你的 .splice() 代码放在那里，现在注意 console.log 东西。

例如：

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

现在您可以将内容保存在您创建的那些变量中，并注意是否存在任何差异。

这里有一个jsfiddle供参考，可以看出对象的不同。 jsFiddle demo

Answer 2

没有直接的方法可以实现这一点。也许你可以使用下面的结果。

//显示新值。 var diff = $(newValue).not(oldValue).get();

//显示旧值。 var diff = $(oldValue).not(newValue).get();

Answer 3

您可以使用 $watchCollection.

来自文档：

The [...] collection is observed via standard $watch operation and is examined on every call to $digest() to see if any items have been added, removed, or moved.

Answer 4

这段代码对我来说没问题

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)

如何检测 $scope.$watch 中删除的项目？

How to detect removed item in $scope.$watch?

angularjs

angularjs-digest