<template is="dom-repeat" items="{{myItems}}">
<div on-click="{{ComputedBindingFunction(item)}}">Foo</div>
</template>
Это приводит к ошибке:
метод слушателя
{{ComputedBindingFunction(item)}}не определен
Не следует ли выполнять функцию вместо того, чтобы буквально пытаться присоединить имя функции с {{}} до on-click в соответствии с docs?
Обратите внимание, что ComputedBindingFunction возвращает функцию.
Пример, показанный в документации, на которую вы ссылаетесь, не предназначен для вызова методов или событий запуска, это для использования вычисленных привязок.
то есть.
<div>{{ComputedBindingFunction(item)}}</div>
Если вы пытаетесь вызвать событие, удалите фигурные скобки:
<div on-click="ComputedBindingFunction"></div>
...
Доступ item из инициированного события
ComputedBindingFunction: function(event){
_ComputedBindingFunction(event.model.item)
}
Во-первых, атрибуты для прослушивателей событий (например, on-click, on-tap и т.д.) не позволяют вычислять привязки как аргумент, а только строку.
Во-вторых, даже если бы они и сделали, что было бы здорово в будущем, ваш пример все равно не сработает, потому что вы возвращаете функцию из вычисленной привязки, а не строки.
Вместо этого ваша вычисленная функция должна возвращать имя функции, которую вы хотите вызвать, которая определяется с помощью аргументов, предоставляемых при запуске события.
<div on-click="{{computeFunction(a, b}}">Button</div>
computeFunction: function(a, b) {
functionName = "add";
this[functionName] = function() {
// Does whatever you want with arguments, a, b
// Like maybe adding them together.
return a + b
}
return functionName;
}
add: function(a, b) {
return a + b;
}
Таким образом, функция, называемая "add", которая вызывается, когда происходит событие on-click, всегда будет использовать новые переменные "a" и "b", назначенные ей.
До тех пор, пока это не будет доступно, чего никогда не будет. Вы можете хранить параметры в атрибуте элемента, который запускает событие.
<div on-click="someFunction" someFunction="{{item}}">Button</div>
someFunction: function(e) {
// Current target is the node that fired the event,
// It has our stored parameter "{{item}}" as a value of "someFunction"
var item = e.currentTarget.getAttribute('someFunction');
// Do something with item
console.log(item);
}
Как вы можете видеть, я сохранил элемент в атрибуте с именем функции, вызванной событием on-click.
Таким образом, легко определить, какие аргументы будут переданы функции, просто просматривая html, и работает для нескольких обработчиков событий в одном элементе.