EmberJS - Personnalisation de la classe de l'élément

Personnalisez la classe de l'élément au moment de l'appel, c'est-à-dire au moment de l'appel du nom de la classe.

Syntaxe

import Ember from 'ember';

export default Ember.Component.extend ({
   classNames: ['name_of_class']
});

Exemple

L'exemple donné ci-dessous spécifie la personnalisation de la classe de l'élément au moment de l'appel. Créez un composant avec le nom post-action , qui sera défini sous app / components / .

Ouvrez le fichier post-action.js et ajoutez le code suivant -

import Ember from 'ember';

export default Ember.Component.extend ({
   classNameBindings: ['isUrgent'],
   isUrgent: true,
});

Ouvrez maintenant le fichier de modèle de composant post-action.hbs avec la ligne de code suivante -

<div class = "ember-view is-urgent">Welcome to Tutorialspoint...</div>
{{yield}}

Ouvrez le fichier index.hbs et ajoutez la ligne de code suivante -

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

Production

Exécutez le serveur de braises; vous recevrez la sortie suivante -