Подтвердить что ты не робот

Как передать параметры с помощью действия Helper Ember.js?

У меня есть список элементов:

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

В щелчке он вызывает метод appClicked представления, к которому принадлежит этот шаблон. Я хочу передать некоторую информацию (например, имя приложения) методу appClicked. Что-то вроде, {{action "appClicked(name)" on="click"}}.

Возможно ли это и как?

4b9b3361

Ответ 1

Я думал о чем-то большем, так как у вас будет доступ к большему количеству через реальный вид. Но Зак, если бы вы могли объяснить немного больше, что именно вы пытаетесь сделать, если это не то, что вы ищете?

App = Ember.Application.create();

App.peopleController = Ember.ArrayController.create({
    content: [ { name: 'Roy', url: '#' },
               { name: 'Mike', url: '#' }, 
               { name: 'Lucy', url: '#' } ]
});

App.PersonView = Ember.View.extend({
    tagName: 'li',
    content: null,
    linkClicked: function() {
        console.log(this.getPath('content.name'));
    }
});
<ul>
{{#each App.peopleController}}
    {{#view App.PersonView contentBinding="this"}}
        <a {{bindAttr href="content.url"}} {{action "linkClicked" on="click"}}>
            {{content.name}}
        </a>
    {{/view}}
{{/each}}
</ul>

Ответ 2

По-видимому, Ember развился сейчас, и есть возможность передать параметр в действие:

{{action "functionName" parameter}}

В вашем случае это будет:

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

Однако вы можете передать любой атрибут из модели (например, id) вместо имени.

Подробнее см. http://emberjs.com/guides/templates/actions/.

Ответ 3

API говорит, что вы можете передать несколько параметров.

html и handlebars:

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

контроллер:

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

Посмотрите в действии в этом jsbin

Ответ 4

Из подзонов вы можете присоединить атрибуты данных и получить доступ к ним в своем контроллере.

Например, на ваш взгляд, если у вас есть:

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

Затем в вашем контроллере

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

Ответ 5

Улучшение ответа Veeb, помните, что у вас есть событие jQuery, чтобы вы могли:

// 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');
    ...
}

Ответ 6

Вы можете попытаться сделать параметр атрибутом <li> или <a> и затем использовать jQuery для доступа к нему.

Может быть что-то вроде

// 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) {
    // You may have to play around and check which DOM element
    // has the the param attribute. From memory it is the parent.
    var param = this.$().parent().attr('param');
    ...
}