Как передать параметры с помощью действия 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"}}
.
Возможно ли это и как?
Ответы
Ответ 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');
...
}