Display a Knockout.js template from a UI Component

Special note

This video goes over how to set the template from a UI Component. There is an alternate method to this! Later in the course, you will learn how to set the template directly with JavaScript from a Knockout.js view model's "defaults" property.

Setting the template with JavaScript is easier, as it involves just setting a template property and a string value. That said, it's not as extensible.

Like everything else in Magento, there is a fallback hierarchy that executes to determine the setting of UI Component & Knockout view model property values. JavaScript has the highest level of precedence, meaning that it overrides other values potentially set with XML.

This means that you should strive for setting configuration & defaults properties with XML if possible, as it makes your code more extensible. Other third-party modules can then easily override the property with XML, and if they need an even higher level of precedence, that can override it with JavaScript.

If your code is 100% local and not intended to be redistributed, setting the property value with JavaScript is a lot simpler and probably preferred.