Angular - 我如何從DOM中刪除我使用$ compile的元素？

Question

我需要的是兩個ng-views的功能。因爲我無法改變某些東西的innerHTML並編譯它。我遇到的問題是當我再次更改內容時，我可以編譯，但是刪除了它自己的綁定，或者我必須手動執行它，如果是這樣，怎麼辦？

編輯：解釋

我想打一個模式，其內容我可以改變，並綁定到不同的範圍（因此$編譯）。但我不想摧毀整個模式，只是其中的一部分內容，然後轉換到另一個模式。我的主要疑慮是，如果通過刪除一些編譯的HTML，它可能導致內存泄漏。

解決

對於這個問題，我創建了一個新的子範圍（以$新的），並把它毀了，每當我改變了內容。 謝謝你的一切

Answer 1

這個問題的解決方案是創建一個新的子範圍。與父範圍的所有綁定因範圍繼承而工作。當我需要更改內容時，我只需銷燬子範圍，避免內存泄漏。

，我也做了和孩子的範圍，以避免poluting闕父範圍getter和setter方法，以防其他內容使用一次性變量

Answer 2

手動刪除元素做一個element.remove()。聽起來像你還想摧毀編譯元素的範圍，所以你也可以通過執行scope.$destroy();或$scope.$destroy();，這取決於你是否在指令中。

http://docs.angularjs.org/api/ng.$rootScope.Scope#$destroy

Answer 3

謝謝你很好的解決方案。我剛剛發佈了一些實現代碼

.directive('modal', function($templateCache, $compile) { 
    return function(scope, element, attrs) { 
     var currentModalId = attrs.modalId; 
     var templateHtml = $templateCache.get(attrs.template); 
     var modalScope, modalElement; 

     scope.$on('modal:open', function(event, modalId) { 
      if(modalId == null || currentModalId === modalId) { 
       openModal(); 
      } 
     }); 

     scope.$on('modal:close', function(event, modalId) { 
      if(modalId == null || currentModalId === modalId) { 
       closeModal(); 
      } 
     }); 

     function openModal() { 
      // always use raw template to prevent ng-repeat directive change previous layout 
      modalElement = $(templateHtml); 

      // create new inherited scope every time open modal 
      modalScope = scope.$new(false); 

      // link template to new inherited scope of modal 
      $compile(modalElement)(modalScope); 

      modalElement.on('hidden.bs.modal', function() { 
       if(modalScope != null) { 
        // destroy scope of modal every time close modal 
        modalScope.$destroy(); 
       } 
       modalElement.remove(); 
      }); 

      modalElement.modal({ 
       show: true, 
       backdrop: 'static' 
      }); 
     } 

     function closeModal() { 
      if(modalElement != null) { 
       modalElement.modal('hide'); 
      } 
     } 
    }; 
});