在指令定義中使用$ compile有什麼意義？

Question

以下代碼與egghead.io`在this視頻中提供的代碼相似，他在那裏構建調試指令。

app.directive('debug',function($compile){// injecting compiler 
    return{ // DDO 
     terminal:true, 
     priority:1000, 
     link:function($scope,$element){ 
      var clone = $element.clone(); 
      clone.removeAttr("debug"); 
      $element.addClass('highlight'); 
      var clonedElement = $compile(clone)($scope); 
      $element.after(clonedElement); 
     } 
    }; 
}); 

我的問題是，什麼是使用的意義$compile到compile的clone，然後加入clonedElement到DOM？我試圖添加（代碼如下）clone而不是clonedElement，它顯然是做同樣的事情。

app.directive('debug',function($compile){// injecting compiler 
    return{ // DDO 
     terminal:true, 
     priority:1000, 
     link:function($scope,$element){ 
      var clone = $element.clone(); 
      clone.removeAttr("debug"); 
      $element.addClass('highlight'); 
      //var clonedElement = $compile(clone)($scope); 
      $element.after(clone); 
     } 
    }; 
}); 

Answer 1

在這個有限的例子中，這是不太可能的，但不同之處在於Angular沒有考慮DOM元素。如果DOM元素有指示或綁定，它們將不起作用，因爲Angular沒有意識到該元素。 $compile是將一個新的DOM元素與Angular關聯起來的。

請務必閱讀documentation以瞭解您不熟悉的API。