防止角JS指令在移動元素時觸發兩次

Question

每次添加元素時，都會再次觸發該指令。我只是想將elem納入icr主模態佈局元素。

.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

我能想到的一種方法是爲Attribute指定此指令而不是Element，並在編譯/鏈接方法中刪除屬性？

.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(); 
     }); 

     }; 
    } 
    }; 
});