EmberJS - 定义组件

您可以轻松地在 Ember.js 中定义组件，并且每个组件的名称中都必须有一个破折号(例如:my-component)。Ember.js 可以使用 Ember.Component 类来定义组件子类。

可以使用以下命令创建组件 −

ember generate component component-name

示例

下面给出的示例描述了如何在 Ember.js 中定义组件。创建一个名为 post-action 的组件，它将在 app/components/ 下定义。

打开 post-action.js 文件并添加以下代码 −

import Ember from 'ember';

export default Ember.Component.extend ({
   toggleBody:['Welcome to Tutorialspoint!!!']
});

现在使用以下代码打开组件模板文件 post-action.hbs −

{{#each toggleBody as |body|}}
   Hello...{{body}}
{{/each}}
{{yield}}

打开 index.hbs 文件并添加以下代码 −

{{post-action}}
{{outlet}}

输出

运行 ember 服务器；您将收到以下输出 −

emberjs_component.html