gpt4 book ai didi

angularjs - 如何使用指令定义的 `replace`?

转载 作者:行者123 更新时间:2023-12-02 21:40:59 25 4
gpt4 key购买 nike

在本文档中:http://docs.angularjs.org/guide/directive ,它表示指令有一个 replace 配置:

template - replace the current element with the contents of the HTML. The replacement process migrates all of the attributes / classes from the old element to the new one. See the Creating Components section below for more information.

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

似乎替换不起作用。我错过了什么吗?

现场演示:http://plnkr.co/edit/rGIgmjO81X2UxJohL4HM?p=preview

最佳答案

您对 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 标签确实被替换了。

关于angularjs - 如何使用指令定义的 `replace`?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15285635/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com