EmberJS - 自定义属性

你可以通过使用 attributeBindings 属性将它们绑定到 DOM 元素来自定义属性。

语法

import Ember from 'ember';

export default Ember.Component.extend ({
   tagName: 'tag_name',
   attributeBindings: ['attr_name'],
   attr_name: 'value'
});

示例

以下给出的示例指定了通过使用 attributeBindings 属性将它们绑定到 DOM 元素来自定义属性。通过名称为 post-action 的组件，将在 app/components/ 下进行定义。

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

import Ember from 'ember';

export default Ember.Component.extend ({
   tagName: 'font',            
   attributeBindings: ['color'],           
   color: "red"
});

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

<div>Welcome to Tutorialspoint...</div>
{{yield}}

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

<h1>Hello</h1>
{{post-action}}
{{outlet}}

输出

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