在Angular Js中transclude:true和replace:true之间的基本区别

Question

嘿,我是角度js的新手,所以我正在通过角度js.org文档制作自定义指令.我想知道transclude和replace之间的基本区别.我已经看到他们使用transclude的几个例子:true和replace:对于自定义指令是true.

对不起,如果这是角js的基本问题.只是让我的基本知识清楚.

Answer 1

当您使用transclude时,您将在页面上包含自定义标记内可用的任何html.例如,如果你有:

<person><p>some text</p></person>

段落标记将包含在您拥有的地点:

template: '<div ng-transclude></div>',

所以你输出到页面的内容如下:

<div><p>some text</p></div>

replace:true只表示模板中的输出完全取代了页面上的html.所以你将不再看到标签(例如,如果你看了html源代码).如果您不使用repace:true,您在屏幕上看到的内容是相同的,但是如果您查看您的html输出,您将看到有关您自己的标签的信息.

没有替换html输出将是这样的:

<person class="ng-isolate-scope"><div ng-transclude=""><p class="ng-scope">some text</p></div></person>

使用替换html输出将是这样的:

<div ng-transclude="" class="ng-isolate-scope"><p class="ng-scope">some text</p></div>