Dynamically-added angle bracket components aren't recognized

[courthead]

http://emberjs.jsbin.com/zahucoyara/edit?html,css,js,output

I have a component that builds a property that's a string with some angle-bracket components inside of it. The string is printed unescaped in the component's template. I would expect Handlebars to recognize the angle-bracket components, however they are treated as normal HTML tags. I'm not sure if this is a bug, if I'm doing something wrong, or if this functionality just isn't supported yet. I've attached a JSBin showing a potential use-case and the issue.

[stefanpenner]

Ya. This isn't something we support, I also suspect we won't as t would require all of the htmlbars compiler client side and would likely be pretty slow. If you wish to add components dynamically. The component helper may be your best bet.

You may also want to look at the context component rfc

[courthead]

@stefanpenner Okay makes sense, thanks for the response. I'll take a look at the context component RFC! Also, pre-glimmer, I was able to do something like this successfully:

App.SomeThingComponent = Ember.Component.reopen({
  _updateLayout: function () {
    const templateStr = '{{some-other-thing value="' + whatever + '"}}';
    const newTemplate = Ember.Handlebars.compile(templateStr);
    this.set('layout', newTemplate).rerender();
  }.observes('whatever').on('init')
});

Post-Glimmer, this still works on initialization. However, when whatever is changed and the function is run again, nothing is updated in the UI after the rerender call. Is this a regression or an intentional side effect of Glimmer?

Thanks again!

[stefanpenner]

Also, pre-glimmer, I was able to do something like this successfully:

Just so you know, running the compiler in production really isn't something I would at all recommend. In-fact I would strongly advise against it.

I am unclear if this particular approach is ever something we intended to support.

this.set('layout', newTemplate).rerender();

that being said, i suspect this line is the issue, are your trying to call rerender on the template or on the component?

[courthead]

The intention is to call rerender on the component after changing its layout. I'll see if I can come up with an alternative approach that doesn't use the compiler. It was slow, but acceptably slow. Worst-case scenario I'll just do the highlighting by modifying the DOM directly instead of using a component.

[rwjblue]

In 1.13 it is not possible to change layout after initial render. There is at least one issue open about this...

[courthead]

Got it, thanks, I'll follow those issues

[rwjblue]

#11315 is a failing test for rerendering after updating layout.

[rwjblue]

Closing in favor of the failing test case PR mentioned above.