防止角JS指令在运动元件时触发两次

Question

每次添加元素时，它都会再次触发该指令。我只想将icr-main-modal-placement元素中的elem移动。

.directive('icrMainModal', function() {
  return {
    restrict: 'E',
    templateUrl: 'views/icr-main-modal.html',
    scope: {
      state: '=icrVState'
    },
    transclude: true,
    compile: function(elem, attrs) {

      angular.element('icr-main-modal-placement').append(elem); // because of this, the directive is fired again. I just want to move elem into 'icr-main-modal-placement'

      return function(scope, elem) {

        scope.$on('$destroy', function() {
          return elem.remove();
        });

      };

    }
  };
});

Answer 1

我能想到的一种方法是为属性而不是元素创建这个指令，并删除编译/链接方法中的属性？

.directive('icrMainModal', function() {
  return {
    restrict: 'A',
    templateUrl: 'views/icr-main-modal.html',
    scope: {
      state: '=icrMainModal'
    },
    transclude: true,
    compile: function(elem, attrs) {
      elem.removeAttr('icr-main-modal');
      angular.element('icr-main-modal-placement').append(elem); 

      return function(scope, elem) {

        scope.$on('$destroy', function() {
          return elem.remove();
        });

      };
    }
  };
});