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

输出：

在使用each帮助程序时，最好的解决方法是什么？

Answer 1

在您的双序卡组件中添加以下代码行。

...
tagName: ''

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

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