EmberJS - Personalización de atributos

Puede personalizar los atributos vinculándolos a un elemento DOM mediante la propiedad attributeBindings .

Sintaxis

import Ember from 'ember';

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

Ejemplo

El ejemplo que se muestra a continuación especifica la personalización de los atributos vinculándolos a un elemento DOM mediante la propiedad attributeBindings . Cree un componente con el nombre post-action , que se definirá en app / components / .

Abra el archivo post-action.js y agregue el siguiente código:

import Ember from 'ember';

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

Ahora abra el archivo de plantilla de componente post-action.hbs con la siguiente línea de código:

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

Abra el archivo index.hbs y agregue la siguiente línea de código:

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

Salida

Ejecute el servidor ember; recibirá el siguiente resultado: