Javascript 强制AngularJS在新元素上重新应用指令

在我的一个项目中，我必须创建一个画布元素，其中包含一些链接到它的事件。因此，我创建了一个接受上下文的指令，在该上下文中，我定义了一组绑定到元素的方法

• 上厕所
• 昂穆斯敦
• 安顿图奇酒店

这在一个画布上运行良好，但当我必须在多个画布之间切换时，会出现问题

以下是模板：

<canvas ng-if="context" drawing-canvas="context"></canvas>

起初，我没有用

替换
部分。它用于创建一个新元素，而不包含以前上下文的绑定事件。这个方法的问题是当我移除画布时。AngularJS似乎对新元素失去了控制，并使其保持自由。我最终得到了多个画布，而不是没有

在切换之前，我试图删除
上下文
，但它似乎发生在同一个
摘要
中，因此上下文永远不会出错，画布也不会从视图中删除。有什么好办法解决我的问题吗

如果有一种方法可以简单地强制AngularJS重新创建画布，我可能还可以删除
$watch

mod.directive('drawingCanvas', ['nano', function (nano) {
  function link (scope, element, attrs) {
    scope.$watch(attrs.drawingCanvas, function (context) {
      var el = element.clone(true)
      element.replaceWith(el)
      element = el

      context.ctx = element[0].getContext("2d")

      //bind events
    })

  return {
    restrict: 'A',
    link: link
  }
}])