带参数的 Polymer 函数调用

Question

这看起来很简单，但我不知道该怎么做。我想使用 "core-collapse-open" 事件将数据发送到 Polymer 组件，但这不起作用：

<core-collapse on-core-collapse-open="{{loadDetails(data)}}">
{{data.Title}}
...

当我使用上面的代码时，聚合物中的 loadDetails 函数没有命中。

Polymer('custom-item', {
        data: {},
        ready: function () {
        },   
        loadDetails: function (e, details, sender) {
            debugger;
        }
    });

如果我没有在声明性语法中使用函数语法（如下所示），loadDetails 函数会命中。

<core-collapse on-core-collapse-open="{{loadDetails}}">
{{data.Title}}
...

如何在事件中发送参数。

Answer 1

on-core-collapse-open="{{loadDetails(data)}}"

这意味着：执行 loadDetails(data) 并且无论 return 的值是什么都将被绑定为事件处理程序。不是你想要的。

此外，事件处理函数已经接收参数：事件对象。您不能向它传递额外的参数。如果你要传递的 data 是指你的 this.data 属性：loadDetails 函数已经可以以 this.data 的形式访问它，所以你不需要通过。

如果您尝试对两个不同的事件使用相同的处理函数并为每个单独的事件传递额外的参数：传统上您会使用匿名函数包装器来做到这一点，而使用声明性语法根本不可能.

Answer 2

您可以将 data 绑定到 core-collapse 的属性，然后使用事件处理程序的 target 参数或 target 属性的 event 参数，或者如果 data 是元素的模型，则只需访问 TemplateInstance （完整示例参见）

Answer 3

我从另一个 post 那里得到了答案。尽管我 post 针对不同的上下文进行了编辑，但我知道我可以使用相同的内容。感谢 Gunter 对该主题的回复。

带参数的 Polymer 函数调用

Polymer function call with parameters

polymer