Using a popover's contentViewClass with ember-cli

[jkatsnelson]

Hi there,

As it is currently written, ember-widgets resolves views in a way that isn't very compatible with ember-cli:

from popover-link-popover.hbs:

<div class="popover-content">
  {{view view._contentViewClass}}
</div>

from popover_link.coffee:

  _contentViewClass: Ember.computed ->
    contentViewClass = @get 'contentViewClass'
    if typeof contentViewClass is 'string'
      return Ember.get contentViewClass
    contentViewClass
  .property 'contentViewClass'

I couldn't figure out any way to resolve an ember-cli view via Ember.get contentViewClass

But, there is a very easy workaround...here is an example:

{{#popover-link-component tagName="button"
  class="btn btn-primary" placement="bottom-left"
  _contentViewClass="custom-popover-content"}}
  Show Popover Button-Left
{{/popover-link-component}}

The key thing to notice is that I am overriding the computed property and just telling the component explicitly where to find the view using {{view 'custom-popover-content'}}

If the maintainers would like, I could add this to the README as a gotcha...

[jkatsnelson]

Also, it appears that there is no support for the 'content' key at all?

[azirbel]

Thanks for the post and for the workaround! Glad you were able to figure it out.

Someone recently fixed this issue in our related ember-table project: https://github.com/Addepar/ember-table/pull/200. I think we should do the same thing here instead of adding a workaround to the README. Do you agree?

[alexdiliberto]

Just started using that workaround on my app for the select widget. Thanks!

@azirbel From a quick first pass, that workaround code would work fine here as well. Using a container.lookupFactory() works on any EmberCLI project and it falls back to the old global lookup in other cases.

[denispeplin]

Could please somebody provide more complete workaround example? I'm now use contentViewClass="App.OvertimeEditView", spent some time trying other variants, no success.

[denispeplin]

Ok, I got it. So steps are:

• Read http://www.ember-cli.com/#views-and-templates carefuly.
• Replace contentViewClass with _contentViewClass.
• Replace App.SomeCustomView with some-custom.

In my case, I replaced contentViewClass="App.OvertimeEditView" with _contentViewClass="overtime-edit". It works now.