Làm thế nào để biên dịch lại một chỉ thị khi chèn vào DOM (angularjs)

Question

Được rồi, vì vậy tôi đã tạo ra một thị giả

<calendar></calendar> 

Nó được kết xuất như tôi mong đợi để mọi thứ hoạt động tốt. Bây giờ, câu hỏi của tôi là làm thế nào để (lại) render nó khi được chèn vào DOM? Tôi không muốn sử dụng nó trên trang của tôi tất cả các thời gian, tôi chỉ muốn tự động thêm nó và render chỉ khi tôi cần nó (nó là một phần của một mô-đun), giả sử, lý tưởng tôi muốn nó xuất hiện như

$("body").append("<calendar></calendar>") 

Làm cách nào để đạt được điều này với angularj?

Answer 1

Bạn cần phải viết dưới hai dòng bất cứ nơi nào bạn muốn tiêm yếu tố chỉ thị của bạn để DOM, đừng quên để thêm $document & $compile phụ thuộc vào bất cứ nơi nào bạn sử dụng.

var template = '<calender></calender>', 
    body = $document.find('body'); 
body.append($compile(template)(scope)); 

Answer 2

Các chuỗi các hành động là thế này:

1. Tạo DOM yếu tố hoặc angular.element đối tượng:

   var calendar = angular.element('<calendar></calendar>'), 
   

2. Vượt qua nó để $compile dịch vụ. Ở giai đoạn này, bạn cần phải cung cấp cho đối tượng phạm vi cần thiết:

   $compile(calendar)(scope); 
   

3. Nối calendar yếu tố để tài liệu:

   angular.element('body').append(calendar); 
   

Vì vậy, tất cả cùng nhau có vẻ như:

var calendar = angular.element('<calendar></calendar>'); 
$compile(calendar)(scope); 
angular.element('body').append(calendar); 

Answer 3

Bạn có thể sử dụng dịch vụ biên dịch $ để biên dịch lại nó và sử dụng angular.element ('body'). chắp thêm để thêm nó vào pa ge một lần nữa. Ví dụ:

var el = $compile("<calendar></calendar>")($scope); 
    angular.element('body').append(el); 

Answer 4

Nó có thể đạt được với yếu tố góc:

angular.element('body').append($compile("<calendar></calendar>")($scope));