25

I have a 3 column layout in my app. I'm using Semantic UI. So, the layout is:

<div class='ui celled grid'>
  <div class='left column'>...</div>
  <div class='middle column'>...</div>
  <div class='right column'>...</div>
</div>

So, straightforward.

In my application.hbs it is simply:

<div class='ui celled grid'>
  <div class='left column'><!-- menu --></div>
  {{outlet}}
</div>

And the other 2 columns are in my sub-controller/templates. And this works fine until I need a View. If I need a View, then Ember makes the HTML layout become:

<div class='ui celled grid'>
  <div class='left column'><!-- menu --></div>
  <div class='ember-view'>
    <div class='middle column'><!-- content --></div>
    <div class='right column'><!-- content --></div>
  </div>
</div>

And the wrapping <div class='ember-view'> breaks my layout. Because I don't always need a View I need a way to make the HTML the same for with or without a View.

At this point, I see 2 solutions. I'll either have to rework my layout in some way (that I'm yet to work out). Or I can get rid of the wrapping div.

But is it possible to get rid of the wrapping div? I tried this:

export default Ember.View.extend({
  tagName: null
});

But that doesn't work. I also tried a span, but that still breaks my layout.

Any ideas?

Thanks.

real_ate
  • 10,861
  • 3
  • 27
  • 48
Johnny Hall
  • 545
  • 4
  • 12

1 Answers1

44

Try using 

tagName:''

The empty string as the tagName's value on your view.

Update: When I brought this to the attention of ember.js contributors, they suggested inheriting the view from 

Ember._MetamorphView

https://github.com/emberjs/ember.js/pull/4790

Hrishi
  • 7,110
  • 5
  • 27
  • 26
  • 1
    That worked. I'm embarrassed to say I didn't try that myself. Thanks! – Johnny Hall Apr 29 '14 at 17:38
  • 1
    Interestingly, this caused side-effects, and broke my layout elsewhere. So, I guess, not supported after all. – Johnny Hall May 02 '14 at 22:53
  • Excellent, thanks for doing that. The _MetamorphView solved the issues I was seeing. I think I'm going to change my layout to make the way the layout work track more closely to my route pattern(s). In general, it works well, but I have some special cases (like this one) where it breaks. – Johnny Hall May 03 '14 at 10:43