EmberJS - Personnalisation de l'élément d'un composant

Personnalisez l'élément à l'aide de la sous-classe Ember.Component et définissez-lui la propriété tagName .

Syntaxe

import Ember from 'ember';

export default Ember.Component.extend ({
   tagName: 'tag_name'
});

Exemple

L'exemple ci-dessous spécifie la personnalisation de l'élément d'un composant à l'aide de la propriété tagName . 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 ({
   tagName: 'h1'
});

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

Welcome to Tutorialspoint...
{{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 -