ngTeleport

All in all, ngTeleport has similar functionality to ngTransclude, but ngTeleport allows you to uproot a piece of the DOM and place it elsewhere. However, ngTeleport is entirely Angular.js aware and therefore sets up the scope and interpolation for you.

Getting Started

First of all you need to define the ng-teleport attribute with a unique identifier for the scope on any DOM element you wish to teleport – this allows ngTeleport to take a note of the precompiled HTML. Once you've defined the ng-teleport you're free to move it around wherever you wish. Simply add teleport to your directive, and invoke it with the source (DOM node with the ng-teleport attribute), target, and any additional options.

<section ng-teleport="myElement">
 
</section>

With the above code section is now all ready to be teleported anywhere in the DOM where there is a valid Angular scope.

teleport(sectionElement, someOtherNode);

Options