EMBER - 每个处理程序都在我的组件周围生成ember-view div

Question

所以,我的容器是一个flexbox,我试图用把手each帮助器渲染组件.问题是flexbox只影响它的直接子节点,并且each帮助器围绕它生成的每个组件都div具有类ember-view,我flexbox显然正在影响divs生成的助手而不是我的组件.

例:

    {{#bi-board-section}}
        <p class="text text--watermark text--bold">NEW</p>
        {{#each model.orders as |order|}}
            {{bi-order-card order=order}}                
        {{/each}}
    {{/bi-board-section}}

OUTPUT:

在使用each帮助器的同时解决这个问题最好的是什么？

Answer 1

在您的双向卡组件中添加此行代码.

...
tagName: ''

这将导致组件无标记.然后该组件将呈现它的html,就好像它没有包装在"ember-view"div中一样.

编辑: #each助手在迭代元素时不会生成任何html.它只是呈现块内的任何内容.另一种可能的解决方案是将bi-order-card组件编辑为flex项目,而不是制作bi-order-card无标签.这可以通过在component.js中而不是在模板中设置tagName和类来完成.