EmberJS - Touches de modification de modèle

Vous pouvez autoriser les touches de modification avec l'aide {{action}} en utilisant l'option allowedKeys. Parfois, l' assistant {{action}} supprime les événements de clic avec les touches de modification enfoncées. Par conséquent, l' option allowedKeys spécifie quelles clés ne doivent pas être ignorées.

Syntaxe

<button {{action 'action-name' allowedKeys = "alt"}}></button>

Exemple

L'exemple ci-dessous montre l'utilisation de l' option allowedKeys sur l' assistant {{action}} . Créez un nouveau composant et nommez-le post-action.js avec le code suivant -

import Ember from 'ember';

export default Ember.Component.extend ({
   actions: {
      //toggling the text
      toggleBody: function () {
         this.toggleProperty('isShowing');
      }
   }
});

Ouvrez le fichier post-action.hbs créé sous app / templates / avec le code suivant -

<button {{action "toggleBody" on = 'click' allowedKeys = "alt"}}>{{title}}</button>
{{#if isShowing}}
<h2>Welcome to TutorialsPoint</h2>
{{/if}}
{{outlet}}

Ouvrez maintenant le fichier application.hbs créé sous app / templates / avec le code suivant -

{{post-action title = "Click Me"}}
{{outlet}}

Production

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

Maintenant, vous cliquez sur le bouton, l’ assistant {{action}} se déclenche avec l’ option allowedKeys pour autoriser les touches de modification -