web-dev-qa-db-fra.com

Comment passer des paramètres avec l'action Helper of Ember.js?

J'ai une liste d'articles:

  <ul>
    {{#each applications}}
      <li>
        <a {{bindAttr href="url"}} 
        {{action "appClicked" on="click"}}>                
           {{name}}
        </a>
      </li>
    {{/each}}
  </ul>

Au clic, il appelle la méthode appClicked de la vue à laquelle ce modèle appartient. Je souhaite transmettre des informations (par exemple, le nom de l'application) à la méthode appClicked. Quelque chose comme, {{action "appClicked(name)" on="click"}}.

Est-ce possible et comment?

javascriptember.jshandlebars.js
19
Panagiotis Panagi

Je pensais à quelque chose de plus dans le sens où vous aurez accès à un plus grand nombre grâce à une vue réelle. Mais Zack, si vous pouviez expliquer un peu plus ce que vous essayez de faire si ce n’est pas ce que vous cherchez?

http://jsfiddle.net/ud3323/4ysxQ/

5
Roy Daniels

Apparemment, Ember a évolué maintenant et il est possible de passer un paramètre à une action:

{{action "functionName" parameter}}

Dans votre cas, ce serait:

<a {{bindAttr href="url"}} 
   {{action "appClicked" name on='click'}}>                
       {{name}}
   </a>

Cependant, vous pouvez transmettre n'importe quel attribut du modèle (comme l'identifiant) au lieu du nom.

Voir http://emberjs.com/guides/templates/actions/ pour plus d'informations.

16
lauhub

L'API dit vous pouvez transmettre plusieurs paramètres. 

html et guidons:

{{officename}} 
<button {{action "actionTest" "hello" "goodbye" officename}}>See parameters through action in the console</button>

manette:

actionTest: function(a, b, c){
   console.log(a);
   console.log(b);
   console.log(c);
},

Voir en action dans ce jsbin

14
HaoQi Li

À partir de sous-vues, vous pouvez attacher des attributs de données et y accéder dans votre contrôleur.

Par exemple, à votre avis, si vous avez:

{{#view Ember.Button target="App.controller" action="publish" data-publish=false}}Unpublish{{/view}}

Puis dans votre contrôleur,

App.controller = Ember.Object.extend({
  publish: function(v){
    var status = v['data-publish'];//your additional information is appended to the view.
  }
}
1
Rajat

Une amélioration à la réponse de Veeb, rappelez-vous que vous avez l'événement jQuery afin que vous puissiez faire:

// template
<ul>
  {{#each applications}}
    <li>
      <a {{bindAttr href="url"}} param="abc" {{action "appClicked" on="click"}}>
         {{name}}
      </a>
    </li>
  {{/each}}
</ul>

// In your js code
appClicked: function (event) {
    var param = $(event.target).attr('param');
    ...
}
0
lacorbeille