如何使用`replace`指令定義？

在本文件：http://docs.angularjs.org/guide/directive，它說，有是一個指令配置replace：如何使用`replace`指令定義？

模板 - 與HTML的內容替換當前元素。替換過程將所有屬性/類從舊元素遷移到新元素。有關更多信息，請參閱下面的創建組件部分。

JavaScript代碼

app.directive('myd1', function(){ 
    return { 
    template: '<span>directive template1</span>', 
    replace: true 
    } 
}); 

app.directive('myd2', function(){ 
    return { 
    template: '<span>directive template2</span>', 
    replace: false 
    } 
});

HTML代碼

<div myd1> 
    original content should be replaced 
</div> 
<div myd2> 
    original content should NOT be replaced 
</div>

但最後的頁面看起來像：

directive template1 
directive template2

看起來replace不起作用。我錯過了什麼嗎？

現場演示：http://plnkr.co/edit/rGIgmjO81X2UxJohL4HM?p=preview

來源

2013-03-08 Freewind

159

你感到困惑與transclude: true，這將追加內的內容。

replace: true意味着指令模板的內容將替換聲明指令的元素，在本例中爲<div myd1>標記。

http://plnkr.co/edit/k9qSx15fhSZRMwgAIMP4?p=preview

例如沒有replace:true

<div myd1><span class="replaced" myd1="">directive template1</span></div>

和與replace:true

<span class="replaced" myd1="">directive template1</span>

正如你可以在後面的例子中看到，在div標籤確實是取代了。

來源

2013-03-08 03:49:40 checketts

什麼transclude： '元素'。它使用ng-transclude時似乎與replace一樣：'true'。 – CMCDragonkai 2014-02-26 12:06:21

是replace：false，就像沒有使用replace一樣？ – Neil 2014-03-19 13:25:47

@ Neil是的。將它關閉與'false'相同＃ – checketts 2014-03-19 15:33:57

正如文檔所述，'replace'決定當前元素是否被指令替換。另一種選擇是基本上是否將其作爲小孩加入。如果你看看你的plnkr的源代碼，請注意，對於第二個指令，其中替換爲false，div標籤仍然存在。對於第一個指令而言，它不是。

第一個結果：

<span myd1="">directive template1</span>

第二個結果：

<div myd2=""><span>directive template2</span></div>

來源

2013-03-08 03:51:27

還我，如果我曾與實際的根元素中模板的TN頂層的評論得到這個錯誤。

<!-- Just a commented out stuff --> 
<div>test of {{value}}</div>

來源

2014-05-25 16:13:34

替換[True | False（默認值）]

影響

1. Replace the directive element.

相關性：

1. When replace: true, the template or templateUrl must be required.

來源

2014-06-06 06:42:42 user3454062

如何使用`replace`指令定義？

回答

相關問題