Javascript 在JS中撤消重做

Javascript 在JS中撤消重做,javascript,angularjs,Javascript,Angularjs,我在$rootScope中排列了一个大对象(比如>100个对象,每个对象又有对象/数组的层次结构),我想用deepWatching来$watch整个$rootScope(即将$watch的第三个参数设置为TRUE) 但是这里的问题是,$watch返回2个对象(即一个旧的RootScope和一个修改的RootScope)。然后,我必须检查$rootScope中对象的哪个属性发生了变化,并检查其层次结构,以将其推入堆栈 在观看$scope时,我们是否有一个简单的方法来更改确切的属性 $scope.$

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

但是这里的问题是,$watch返回2个对象(即一个旧的RootScope和一个修改的RootScope)。然后,我必须检查$rootScope中对象的哪个属性发生了变化,并检查其层次结构,以将其推入堆栈

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

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

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

}, true);
或者,我可以在对象的每个属性上添加watch,但它似乎非常昂贵

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

注意:-

  • 角度历史不适合我的需要,因为我想观察对象的所有属性,其中可能还包含其他对象和数组

  • 我肯定观看整个$rootScope也不是一个好主意,但我的目标是构建一个包含多个网格的UI,拖放,可能包含表单,元素可以删除。所以我想构建一个整体解决方案来堆叠更改并在CTRL+Z上撤消它。想象一下复制桌面版的Photoshop


  • 我将使用数组(将其用作队列),而不是查看整个$rootScope或任何一个包含大量项的对象,这些项反过来又包含大量项,需要您在每个摘要上迭代该嵌套数组应用于原始数据模型的更改的数量,以及指向该队列中当前位置的变量

    我将把那个数组和那个变量放在一个服务中,然后在每次撤消/重做时更改那个索引。您可以在任何需要响应这些更改的地方查看该变量,例如指令

    撤消/重做基于。是的,将会有很多手表;如此丰富的功能并不便宜

    为了好玩,这里有一个简单的(但非常实用和可扩展)实现:

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

    function XxxCommand() {
        // implementation specific
    }
    Command.prototype.execute = function() {
        // implementation specific
    };
    Command.prototype.rollback = function() {
        // implementation specific
    };
    
    用法:您可以使用以下指令装饰
    s:

    <input name="name" undoable ng-model="data.name" />
    
    <form undo-support>
    
    可撤消
    的链接功能监听
    中的更改,并向
    可撤消支持
    注册命令。
    undoableSupport的控制器跟踪命令列表。

    库提供undo/redo


    目前尚未维持。最近的fork似乎是。

    还有一个名为的undo/redo库。至少对我自己来说,这是一个比角度历史更好的选择。

    我认为LazyJsonUndoRedo是你想要的

    自述文件:

    “插入式”历史处理程序,使用ES6 Object.observe()或ES6.observe()为嵌套javascript对象提供自动撤消/重做功能


    感谢您的回复!如果我错了,请纠正我,您的意思是说将整个$rootScope保存到数组堆栈中,然后来回移动指针,这是我最初的想法,但最终浏览器将挂起,因为$rootScope可以作为一个整体保存为一个巨大的数据结构。推送多个实例可能会严重影响性能!不,不是整个$rootScope,只是一个包含可能更改的其他对象的对象。$rootScope.ETC是要监视的主要对象,现在“ETC”可以包含100多个对象,n每个对象可以包含多个其他对象。我需要查看整个等。但是我如何准确地知道继承人制度中更改了哪些属性?我假设您在页面上显示该对象的内容时,通过ng模型或指令以某种方式将其值与dom元素关联,等。每当该用户更改该dom元素的值时,您可以让您的指令设置一个脏标志,并以允许您将其与原始值关联的方式记录更改是的,正确。我的应用程序由几个指令组成,我也可以将$watch放在指令级别!但问题是该指令也可以包含多个对象。同样的问题,它会返回我整个对象的改变。因此,最后我将通过重新诅咒对象来找到更改的确切属性!想象一下这个递归函数每次执行一次,哪怕是一次按键。如果我们有50条指令,并且每条指令至少有50个对象,那么这将非常昂贵。如果有人反对,请在评论中提供原因。对于2016年或之后得出此答案的人:这不是角度特定的,它是针对普通对象的。
    对象。观察
    是一项放弃的工作。将使用现代的非角度实现。