Template to UI template

I wonder if someone could help me (again :)).

Is it possible pass large parts of html from a template node to a UI template.

I know you can use mustache to pass variables, but what about chunks of html.

My use case is I have a UI template that will contain among other things an svg. But this svg will depend on initial settings made by the user.

So what I would like to do is create the html in the template node, passing the relevant svg in as a variable.

What I am having to do at the moment is have all the svgs I need in the UI template and then use JavaScript to show/hide the ones I want, but this seems like really bad way to do it.

If any of you clever chaos could help me, I would be very grateful.

Kind regards


Hello again - sorry I am developing a habit of finding the answer after asking the question!!

If this is helpful someone else:

For some reason the ui template doesn't like it if you include svg's in the template node - it shows the rest of the html properly, but the space where the svg should be is just blank.

One solution to this (posted by someone else) is to put the svg(only) in the template node and then use this code to add it to the div

    ;(function(scope) {
        scope.$watch('msg', function(msg) {
            if (msg.payload) {

However this means that it will have to be refreshed every time there is a new connection.

The best solution for me (which is described in the info for the template, I swear I did look there!) is to use the msg.template option which sets the ui-template's template. For some reason if you do it this way, it will accept all the html as well as the svg's. (I think:))

Kind regards


This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.