data-binding - 如何在 Polymer 的自动绑定(bind)模板中为属性添加监听器？

Question

我正在用 Polymer 编写一个 webapp，我正在使用一个自动绑定(bind)模板和一个分页属性:

<template is="dom-bind">
  <iron-pages selected="{{page}}" attr-for-selected="id">
    <section id="login">
       ...
    </section>
    <section id="main">
       ...
    </section>
  </iron-pages>
</template>

但是我如何实现一个在 page 改变时触发的监听函数呢？在自定义元素中，我会使用声明的属性:

Polymer({

  ...

  properties: {
    page: {
      type: String,
      notify: true
    }
  },

  pageChanged: function() {
    // My listener function
  }
});

所以我尝试将 properties 和 pageChanged 设置为模板元素:

var template = document.querySelector('template');
template.properties = { ... };
template.pageChanged = function() { ... };

但是 properties 属性已经被保留了。

你知道怎么做吗？提前致谢，

菲利克斯

Answer 1

您可以使用 property observer :

Polymer({

  properties: {
    page: {
      type: String,
      notify: true
      observer: 'pageChanged'
    }
  },

  pageChanged: function(newPage,oldPage) {
    // My listener function
  }
});