2016-04-07 5 views
3

フランスの地図や世界の地図を表示するかどうかを選択するラジオボタンのグループがあります。私の問題は、ポリマーの公式文書では、ラジオボタン状態のイベントとして「変更」のみが記載されているということです。問題は、下の私の現在のコードでは、別のラジオボタンをクリックするだけで意図したとおりに動作しますが、すでに選択されているラジオボタンをクリックすると、この "変更"イベントが発生します(私の意見では、私の質問は以下の通りです:ラジオボタン状態のための他のイベントはありますか? "checked"、 "selected"を試みましたが、これらのどれも動作していないようです。 。ポリマーのラジオボタンの「変更」以外の状態

ここに私のコードです:

<div id="mapSelector"> 
<paper-radio-group id="mapSelectors" selected="radioWorld"> 
    <paper-radio-button id="radioFrance" name="radioFrance">France map</paper-radio-button> 
    <paper-radio-button id="radioWorld" name="radioWorld">World map</paper-radio-button> 
</paper-radio-group> 
</div> 

<div id="containerFrance" hidden="{{hideFrance}}" style="width: 800px; height: 600px;"> 
</div> 

<div id="containerWorld" hidden="{{hideWorld}}" style="width: 800px; height: 600px;"> 
</div> 



</template> 

<script> 
Polymer({ 
    is: 'page-maps', 
    listeners: { 
     'radioFrance.change': 'toggleMaps', 
     'radioWorld.change': 'toggleMaps' 
    }, 
    hideFrance: { 
     type: Boolean, 
     value: false 
    }, 
    hideWorld: { 
     type: Boolean, 
     value: true 
    }, 
    toggleMaps: function() { 
     this.hideFrance = this.hideWorld; 
     this.hideWorld = !this.hideWorld; 
    } 
}); 
</script> 
</dom-module> 

答えて

0

変更イベントを使用しますが、その後そのように、コールバックであなたのトグルボタンの値を確認します

Polymer({ 
    is: 'page-maps', 
    listeners: { 
     'radioFrance.change': 'toggleMaps', 
     'radioWorld.change': 'toggleMaps' 
    }, 
    hideFrance: { 
     type: Boolean, 
     value: false 
    }, 
    hideWorld: { 
     type: Boolean, 
     value: true 
    }, 
    toggleMaps: function (e) { 
     if(e.srcElement.value == false){ 
      //do some code 
     }else{ 
      //do some other code 
     } 
    } 
}); 
関連する問題