自定义属性（Customizing Attributes）

优质

小牛编辑

133浏览

2023-12-01

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

语法 (Syntax)

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

例子 (Example)

下面给出的示例指定通过使用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 xnip...</div>
{{yield}}

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

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

输出 (Output)

运行ember服务器; 你会收到以下输出 -