javascript - polymer 将 Tap 绑定(bind)到对象方法

Question

我正在尝试将方法绑定(bind)到纸张按钮的点击属性。经过多次测试，我发现我只能绑定(bind)一个(因为没有更好的词)顶级函数，而不能绑定(bind)模板中对象的方法。

例如，我有一个模板，我在其中绑定(bind)了许多对象，其中之一是用户对象。对象 user 有很多方法和变量，例如“isNew”或“reputation”。用户对象还有一个方法“addReputation”

我可以像这样使用对象变量:

       <template if = '{{user.new}}'><h1>{{user.name}}</h1></template>

我可以像这样绑定(bind)按钮点击:

      <paper-button on-tap='{{addReputation}}'>Add Rep</paper-button>

但不是这样的:

      <paper-button on-tap='{{user.addReputation}}'>Add Rep</paper-button>

有谁知道这是为什么吗？

Answer 1

如果您将该方法设置为元素原型(prototype)上的处理程序，它就会起作用。这样您仍然可以保持动态:

<script src="http://www.polymer-project.org/webcomponents.min.js"></script>
<script src="http://www.polymer-project.org/polymer.js"></script>

<polymer-element name="my-element" on-tap="{{tapHandler}}">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    click me
    <content></content>
  </template>
  <script>
    Polymer({
      created: function() {
       this.user = {
         method: function() {
           alert('hi');
          }
        };
        this.tapHandler = this.user.method;
      }
    });
  </script>
</polymer-element>

<my-element></my-element>