在ember/ember-cli中的子文件夹中生成组件

Question

根据Ember 2.0的准备建议 ......

•通常,用组件替换视图+控制器
•仅在路由级别使用控制器...

......我们应该避开Controller和View支持Components.我无法弄清楚和/或理解如何生成不是components文件夹的直接父代的组件,即components/component-name.js.

我当前的控制器文件夹看起来像:

/controllers
    /account
        index.js
        edit.js
    /business
        index.js

基本上,有一些子文件夹可以根据应用程序的各个部分对逻辑进行分组.我怎样做到这一点只是组件？

看到组件中必须有" - ",我试过,但是出错...

ember generate component account/index-module.js
You specified "account/index-module.js", but due to a bug in Handlebars (< 2.0) slashes within components/helpers are not allowed.

是否所有组件都必须如此

components
    account-index.js
    account-new.js
    business-index.js

即所有在同一个文件夹？这将开始失控,增加了我实际认为是组件(像video-viewer.js,text-editor.js,radio-button.js这样的东西).

我真的想在子文件夹中包含组件,但不确定如何执行此操作.

components
    /media
        /audio
            audio-player.js
        /video
            video-player.js
    /text-editing
        text-editor.js
        editor-toolbar.js

我的组件文件夹已经很糟糕,我刚刚开始:

是否可以将帐户/业务逻辑保留在控制器中(看到它确实说您应该只在路由级别使用控制器)？

我真的很困惑这个"所有组件,所有时间"的惯例.

Answer 1

好吧,所以我有同样的问题和ember 1.9-beta.3(这是我测试的版本).可以将组件嵌套在资源目录下.

这意味着您可以拥有"用户"路线或资源.并且假设您有一个只想与用户资源一起使用的组件,因此您希望将该组件放在资源目录下.

这样做的方法是将组件放在资源目录下app/pods/user/component-name/template.hbs.重要的是要记住组件名称中必须包含破折号.它不能只是.../user/component必须.../user/component-name与破折号.然后,您可以{{user/component-name}}在模板中使用该组件.

此外,我认为这只有在你使用pod结构时才有可能.

Answer 2

好的，我认为这个问题/答案需要在 2019 年进行一些更新。我已经使用 Ember 大约一个月了，我的组件文件夹已经变成了一个猪圈。教程和主要 API 文档并未真正涵盖如何组织您的组件。

所以我当然做了搜索。我能找到的唯一答案（比如这个）来自 2014-2015 年左右，并且不反映现代 Ember。当我在 Ember 语法转换指南中发现这个时，我正准备接受我的命运。（Ember 人员注意：这是一个重要的问题，几乎每个新用户都会遇到。它应该在文档中更加突出。也许不是教程，但肯定在组件部分）

实际上，您可以在 Ember 的子文件夹下生成组件，如下所示：

$ ember generate component foo/bar-baz
installing component
  create app/components/foo/bar-baz.js
  create app/templates/components/foo/bar-baz.hbs
installing component-test
  create tests/integration/components/foo/bar-baz-test.js

太好了，文件是在components/foo和下创建的templates/components/foo。并且要解析组件的名称以在另一个模板中使用，您可以使用旧样式语法：

{{foo/bar-baz }}

或者新风格的尖括号语法：

<Foo::BarBaz />