如何使用`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`指令定义？

回答

相关问题