我有一个难以解释的问题，就Java，TrueType，Angular和MxGraph方面的专业知识而言，我已经超出了我的舒适范围...希望能够进行解释。
我有一个Angular组件显示和MxGraph。通过此链接（How to integrate mxGraph with Angular 4?），我能够将MxGraph与Angular集成。即使我使用Angular 7，该解决方案仍然有效...
该图正确显示在页面上，并且一切正常，包括我对函数graphHandlerMouseUp的重写，我使用此代码执行此操作：
// Save the position of the mouse when releasing the button: used for
// detecting the target in a drag and drop
mx.graphHandlerMouseUp = mx.mxGraphHandler.prototype.mouseUp;
mx.mxGraphHandler.prototype.mouseUp = function( graph, evt ) {
currentdropX = evt.graphX;
currentdropY = evt.graphY;
mx.graphHandlerMouseUp.apply(this, arguments);
}
当我第一次运行此页面时，不会发生任何问题。
然后通过一个按钮，我调用另一个组件的页面（通过路由）。如果从该页面（再次通过routerlink）返回第一个组件，则该页面和带有MxGraph的组件正确加载，但是当我使用此功能时（即释放鼠标按钮）。
在我看来，这是一个麻烦的问题，例如当我输入如下控制台输出时：
// Save the position of the mouse when releasing the button: used for
// detecting the target in a drag and drop
mx.graphHandlerMouseUp = mx.mxGraphHandler.prototype.mouseUp;
mx.mxGraphHandler.prototype.mouseUp = function( graph, evt ) {
currentdropX = evt.graphX;
currentdropY = evt.graphY;
// INIFINTE LOOP HERE
console.log("Test");
mx.graphHandlerMouseUp.apply(this, arguments);
}
“测试”的编写次数不断增长。但是，据我了解，这是重写功能的正确方法。当然，在页面的第一次加载中，“测试”仅显示一次。传递到另一个组件，然后再返回该组件，它显示“无限”的次数（直到我达到：“ ERROR RangeError：超出最大调用堆栈大小”））...
我也尝试删除该替代，除了明显缺乏功能之外，函数“ mxDragSource”也发生了同样的问题，该问题已被相同的方法替代。
就像我说的那样：我对javascript，truetype，MxGraph或Angular不够熟练，因此，即使很明显，任何提示都非常受欢迎！
谢谢！
最佳答案
第一次运行代码时，将mx库的mouseUp事件存储在一个变量中，然后为mouseUp事件分配一个新函数，在该函数中您将调用旧的mouseUpEvent。
第二次运行代码时，将存储当前的（已修改的）mouseUp事件，并分配一个函数，在该函数中调用旧的mouseUpEvent，该函数与以前存储的相同。有你的递归！
您需要做的是正确地覆盖第三方功能，因此您不必两次执行代码。
怎么做 ？
您可以创建一个mixin并在componentB /中使用此mixin。如果您不知道它是什么以及如何执行此操作，请在stackblitz中重现您的问题，我们将很乐意帮助您实现它。