紙ラジオボタンが正しく更新されない

Question

選択したユーザータイプに応じて異なるフィールドを表示するフォーミュラを作成したいとします。 このため、私はこのグループのselectedプロパティにラジオグループといくつかのデータバインディングセットを持っています。

<paper-radio-group id="newUserTypeRadio" selected="{{newUserType}}"> 
    <paper-radio-button name="admin">admin</paper-radio-button>  
    <paper-radio-button name="user">user</paper-radio-button> 
    <paper-radio-button name="guest">guest</paper-radio-button> 
</paper-radio-group> 

私のリスナー：

listeners: { 
      "newUserTypeRadio.change": "userTypeForm" 
     } 

と（今のところ）である関数は、ちょうどconsole.log

 userTypeForm: function() { 
      console.log("user type : ", this.newUserType); 
     } 

はSOええ、それはそれです。問題は、最初に「Admin」ラジオボタンをクリックすると、ログにundefinedと表示され、次に「guest」がクリックされ、ログに「admin」などが表示されるため、selectedの値は常に以前の値です。現在のものではありません。

これを修正する方法はありますか？

Answer 1

はここで、observer代わりlistener

<base href="https://polygit.org/components/"> 
 
<script src="webcomponentsjs/webcomponents-lite.min.js"></script> 
 
<link href="polymer/polymer.html" rel="import"> 
 
<link rel="import" href="paper-radio-group/paper-radio-group.html"> 
 
<link rel="import" href="paper-radio-button/paper-radio-button.html"> 
 
<dom-module id="radio-group"> 
 
    <template> 
 
    <style></style> 
 
    <paper-radio-group id="newUserTypeRadio" selected="{{newUserType}}"> 
 
     <paper-radio-button name="admin">admin</paper-radio-button> 
 
     <paper-radio-button name="user">user</paper-radio-button> 
 
     <paper-radio-button name="guest">guest</paper-radio-button> 
 
    </paper-radio-group> 
 
    </template> 
 
</dom-module> 
 
<script> 
 
    Polymer({ 
 
    is: 'radio-group', 
 
    properties: { 
 
     newUserType: { 
 
     type: String, 
 
     observer: 'userTypeForm' 
 
     } 
 
    }, 
 
    userTypeForm: function(newVal, oldVal) { 
 
     console.log("oldvalue:" + oldVal, ", current value:" + newVal, ", newUserType value:" + this.newUserType); 
 
    } 
 
    }) 
 
</script> 
 

 

 
<radio-group></radio-group>