我在$ rootScope中排列了一个大对象(例如> 100个对象,每个对象又具有对象/数组的层次结构),我想用deepWatching $ watch监视整个$ rootScope(即将$ watch的第3个参数设置为TRUE)。

但是这里的问题是,$ watch返回2个对象(即一个Old RootScope和Modified RootScope)。然后,我必须执行一个过程,检查对象的哪些属性在$ rootScope及其层次结构中更改,以将其插入堆栈。

在观看$ scope时,是否有一种简单的方法来更改确切的属性?

$scope.$watch($rootScope, function(oldObj, newObj){

   //all I want here is exactly what attribute changed, NOT entire objects!

}, true);

或者,我可以在Object的每个属性上添加监视,但它看起来非常昂贵。

在angular js中实现撤消/重做的最佳方法是什么?

请注意:-
  • angular-history不适合我的需要,因为我想观察对象的所有属性,其中可能还包含其他对象和数组。
  • 我敢肯定整个$ rootScope也不是一个好主意,但我的目标是建立一个具有多个网格的UI,拖动n放下,可能包含表单,可以删除元素。因此,我想构建一个整体解决方案以堆叠更改并在CTRL + Z上撤消更改。想象一下复制Photoshop的 table 面版本。
  • 最佳答案

    撤消/重做基于command pattern。是的,会有很多 watch 。如此丰富的功能并不便宜。

    仅出于乐趣,这是一个简单的(但相当有用且可扩展)的实现:http://jsfiddle.net/sYc4e/1/

    命令是知道如何应用和回滚更改的对象的接口(interface):

    function XxxCommand() {
        // implementation specific
    }
    Command.prototype.execute = function() {
        // implementation specific
    };
    Command.prototype.rollback = function() {
        // implementation specific
    };
    

    用法:使用指令装饰<input>:
    <input name="name" undoable ng-model="data.name" />
    

    并使用<form>指令将它们包装在一个元素(例如undo-support)中:
    <form undo-support>
    
    undoable的链接函数监听<input>中的更改,并向undoableSupport注册命令。 undoableSupport的 Controller 跟踪命令列表。

    10-07 19:04
    查看更多