Polymer 1.0 paper-radio-group selection - how to g

问题:

I have tried this solution but seems like it is doing nothing for me. I have Polymer 1.0.

Only change I made from the solution is to put the observers inside data property and made is "not protected". I got this idea from here.

Initially I used the exact approach as in Ricky's solution but that didn't work for me either.

Here is how my custom element looks like:

<dom-module id="radio-group-binder">
  <template>
        <paper-radio-group class="layout vertical" selected-item="[[selectedItem]]">
          <template is="dom-repeat" items="[[data]]">
                <paper-radio-button name="{{item.model}}" model$="[[item.model]]" price$="[[item.price]]"><span>[[item.model]]</span> <div class="paper-font-caption"><span>[[item.price]]</span> SEK</div></paper-radio-button>
          </template>
        </paper-radio-group>
        <paper-item><span>[[model]]</span></paper-item>
        <paper-item><span>[[price]]</span></paper-item>
  </template>
  <script>
      (function () {
          'use strict';

          Polymer({
              is: 'radio-group-binder',

              properties: {
                  data: {
                      type: Array,
                      notify: true,
                      observers: ['selectedItemChanged(selectedItem)']
                  },

                  price: {
                      type: String,
                      notify: true
                  },

                  model: {
                      type: String,
                      notify: true
                  }
              },

              
              selectedItemChanged: function (el) {
                  this.price = el.getAttribute('price');
                  this.model = el.getAttribute('model');
              },
          });
      })();
  </script>
</dom-module>

If I have understood right, then variables like [[model]] and [[price]] under each paper-item should get replaced by selected values.

I tried an alert inside the selectedItemChanged function to check whether it is at least being called but I got none.

Again, in this post I noticed that Polymer version 1.0.2 is mentioned and this a fix has been introduced here. Is this the issue I am facing? If so, how can I upgrade to this version? If this not the case then please let me know what wrong I am doing.

回答1:

There is no observers field for a property. You either have to use a single observer property (see here) or a an observers field on the "class" itself (see here):

properties: {
  data: {
    type: Array,
    notify: true,
  },
},
observers: ['selectedItemChanged(selectedItem)']