Ember.js View 没有包装 Div？

Question

我的应用程序中有 3 列布局。我正在使用语义用户界面。所以，布局是:

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

所以，简单明了。

在我的application.hbs很简单:

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

另外两列位于我的子 Controller /模板中。这工作正常，直到我需要 View 。如果我需要View ，那么Ember使HTML布局变成:

<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>

还有包装<div class='ember-view'>破坏了我的布局。因为我并不总是需要 View我需要一种方法使 HTML 在有或没有 View 时都相同.

此时，我看到了 2 个解决方案。我要么必须以某种方式重新设计我的布局(我还没有解决)。或者我可以去掉包装 div。

但是有可能摆脱div的包裹吗？我试过这个:

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

但这行不通。我还尝试了span ，但这仍然破坏了我的布局。

有什么想法吗？

谢谢。

Answer 1

尝试使用

tagName:''

空字符串作为 View 中 tagName 的值。

更新:当我将此问题提请 ember.js 贡献者注意时，他们建议继承

的 View

Ember._MetamorphView

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