Góc - Làm cách nào để xóa DOM khỏi phần tử tôi đã sử dụng biên dịch $?

Question

Điều tôi cần là chức năng của hai chế độ xem ng. Bởi vì tôi không thể thay đổi innerHTML của một cái gì đó và biên dịch nó. Vấn đề tôi gặp phải là khi tôi thay đổi nội dung một lần nữa, tôi có thể biên dịch, nhưng góc cạnh có gỡ bỏ ràng buộc của nó hay không, hoặc tôi phải làm điều đó bằng tay, nếu vậy, làm thế nào?

EDIT: Giải thích

Tôi muốn thực hiện một phương thức, mà nội dung tôi có thể thay đổi và liên kết với phạm vi khác nhau (do đó $ biên dịch). Nhưng tôi không muốn phá hủy toàn bộ phương thức, chỉ là một số nội dung của nó, và thay đổi thành nội dung khác. Nghi ngờ chính của tôi là nếu loại bỏ một số HTML đã biên dịch, nó có thể dẫn đến rò rỉ bộ nhớ.

SOLVED

Đối với vấn đề này, tôi đã tạo một phạm vi con mới (với $ mới) và phá hủy nó bất cứ khi nào tôi thay đổi nội dung. Cảm ơn mọi thứ

Answer 1

Giải pháp cho vấn đề này là tạo ra phạm vi con mới. Tất cả các ràng buộc với phạm vi công việc của cha mẹ vì phạm vi Thừa kế. Khi tôi cần thay đổi nội dung, tôi chỉ đơn giản là phá hủy phạm vi con, tránh rò rỉ bộ nhớ.

Tôi cũng đã thực hiện và getter và setter cho phạm vi con để tránh phạm vi mẹ poluting que, trong trường hợp các nội dung khác sử dụng các biến dùng một lần

Answer 2

Để xóa phần tử theo cách thủ công, hãy thực hiện element.remove(). Có vẻ như bạn cũng muốn phá hủy phạm vi phần tử đã biên dịch của mình để bạn có thể thực hiện điều đó bằng cách thực hiện scope.$destroy(); hoặc $scope.$destroy(); tùy thuộc vào việc bạn có đang chỉ thị hay không.

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

Answer 3

Cảm ơn bạn giải pháp tốt. Tôi vừa đăng một số mã thực hiện

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