Notify polymer about new function result

Question

How can I tell Polymer 2.0 about a change of a function result even though the input command did not change? Consider this small example, which modifies my-view1 of the basic polymer-2-starter-kit:

<dom-module id="my-view1">
  <template>
    <style include="shared-styles">
      :host {
        display: block;

        padding: 10px;
      }
    </style>

    <div>[[getText(node)]]</div>

    <paper-button on-tap="changeElements">Change elements</paper-button>
  </template>

  <script>
    class MyView1 extends Polymer.Element {
      static get is() { return 'my-view1'; }

      static get properties() {
        return {
           node: {
            type: Number,
            value: 0
          },

          node2: {
            type: Number,
            value: 5
          }
        }
      }

      changeElements() {
        this.node2 += 1;
        console.log(this.getText(0));
      }

      getText(item) {
        return this.node2;
      }

    }

    window.customElements.define(MyView1.is, MyView1);
  </script>
</dom-module>

When I click the button, node2 and thus the result of getText changes which is shown in the console. However, the depicted value constantly remains at the initial value 5. I guess, since node does not change, the change is not handled. Is there a possibility to notify Polymer about the change of the function result? Something like notifyPath for functions or similar? Or do I need to set some flags or something like that?

While I'm aware that this minimal example would easily be solved by just outputting node2 instead of using getText(node), it's a lot more complex in my regular project where a function computes the output based on different factors.

Jeff Machamer Jeff Machamer · Accepted Answer · 2017-07-21T20:29:12

You are using a computed binding with the node property, which means it will only get recomputed when node is updated. You would need to bind with node2 if you want it to fire when node2 is updated. (or bind to node and node2.. )

A bit of an odd example since you are binding to a value that you aren't using.

Notify polymer about new function result

2 Answers