/ / Защо трябва да поставя „trasnclude: true“ в ъглово DDO? - angularjs, angularjs-директива, включване

Защо трябва да задам "trasnclude: true" в ъглова DDO? - angularjs, angularjs-директива, transclusion

аз знам какво transclude: true прави, но аз винаги съм се чудил: "защо трябва да поставя transclude: true в моя ДДО, както и ng-transclude в шаблона ми? ".

Какво се случва вътрешно, което принуждава ъгловите да бъдат излишни? Това ли е защита / XSS защита?

Отговори:

1 за отговор № 1

Най- ngTransclude документация обяснява разделянето на двете (акцент ми):

[ngTransclude е] директива, която маркира точката на вмъкване за превишения DOM най-близък родител директива, която използва включване.

Това означава:

  • transclude: true посочва, че директивата предоставя нейното съдържание за включване.

  • ng-transclude показва къде трябва да върви съдържанието.

Директивата с включено включване всъщност не трябва да се справя с включването на собственото му съдържание. Тя може да позволи на детето да избере къде да постави включеното съдържание.

Ето един (тривиален) пример, който показва как транзикацията може да се управлява от директивата за дете в рамките на родител:

<!-- Application template -->
<parent-el>
<h1>Transcluded content</h1>
</parent-el>


<!-- <parent-el> template -->
<p>I am the parent element</p>
<child-el></child-el>


<!-- <child-el> template -->
<p>I am the child element</p>
<div ng-transclude></div>

По този начин съдържанието ще се визуализира в страницата:

<!-- Rendered content -->
<parent-el>
<p>I am the parent element</p>
<child-el>
<p>I am the child element</p>
<div>
<h1>Transcluded content</h1>
</div>
</child-el>
</parent-el>

1 за отговор № 2

Има три вида включване в зависимост от това дали искате да включите само съдържанието на елемента на директивата, целия елемент или няколко части от съдържанието на елемента:

  • true - включване на съдържанието (т.е. детските възли) на елемента на директивата.
  • "element" - да включи целия елемент на директивата, включително всички директиви за този елемент, които са дефинирани с по-нисък приоритет от тази директива.
  • {...} (хеш на обект): - картографира елементите на съдържанието върху "слотове" за включване в шаблона.

-- https://docs.angularjs.org/api/ng/service/$compile#transclusion