what is top-to-bottom/bottom-to-top inclusion in html templating

Question

This is one topic that is really hard to find any real material on. What does it mean for a templating engine to support top-to-bottom/bottom-to-top inclusion. I only stumble on this when i read books that barely even scratch the surface of templating.

In Angular JS Directives, it was used to explain the function of the "Transclude" setting for configuring directives and in Apress Practical NodeJs, it said jade supports it. Anyone know what this means?

Answer 1

The Practical Node author is here. ;-)

The top-down inclusion is a standard inheritance pattern in which the parent object commands where and what to do with the child (the object that is included).

So you have a file A that includes file B. And the file A will do with file B what it wants. In Jade you use include filename (without quotes). This approach is used by most languages.

The alternative to top-down is the bottom-up pattern. Not all languages support it. In this case you have file A that is a larger and more higher-up-the-chain entity, and file B being a smaller piece of the puzzle. But file B will do what it wants.

You can also think about top-down approach as overwriting of some methods in a child class when you extend those methods from the parent class, but leavind the others in tact.

In Jade bottom-up is implemented with a set of extend, layout and block statements. For deep coverage on Jade, refer to Practical Node.js [2014, Apress] .