AngularJS 指令中的 replace:true
默认值是fasle,模板会被当作子元素插入到调用此指令的元素内部。
<my-directive></my-directive>
myModule.directive("myDirective",function(){ return { template:"<h3>我是模版</h3>" } })
结果:
<my-directive> <h3>我是模版</h3> </my-directive>
若设置为replace:true
myModule.directive("myDirective",function(){ return { template:"<h3>我是模版</h3>", replace:true } })
结果:
<h3>我是模版</h3>
没有根元素 <my-directive></my-directive>,直接覆盖。
注意的是:
在这种情况下模版要又根元素,如模版如下:
<h3>我是模版</h3><p>兄弟</p>
没有包裹的根元素,h1 和 p是同级元素的情况下,使用 replace:true 会报错,所以,指令模板必须要有一个根元素包裹。