私はPolymerを初めて使い、親要素の中の要素から戻り値を取得したいと考えています。Polymerは要素からの戻り値を取得し、インスタンスメソッドを使用します
基本的に、ボタンをクリックすると、ラジオボタンをクリックすると、ラジオボタンをクリックするとラジオボタンの値が返されます。しかし、ダイアログが開かれるたびに、ラジオボタンをクリアし、ajaxコールを使用してリストを再ロードします。
私の問題は1です。私はPolymerオブジェクト内のメンバー関数を使用できないようです。そして、第二に、私はダイアログ要素から適切に「戻り値」を得ているとは思わない。あなたが見ることができるように
<dom-module id="opr-play-file-dialog">
<template>
<iron-ajax
id="currentPlaylistAjax"
url="/current-playlist"
handle-as="json"
last-response="{{ajaxResponse}}"
on-response="handleResponse">
</iron-ajax>
<paper-dialog
entry-animation="scale-up-animation"
exit-animation="fade-out-animation"
id="playFileDialog">
<h2>Play file</h2>
<paper-spinner active id="playFileLoadingSpinner"></paper-spinner>
<paper-radio-group on-change="positionOnChange" id="positionRadio" attr-for-selected="value">
<template is="dom-repeat" items="[[ajaxResponse.data]]">
<paper-radio-button value="[[item.position]]">[[item.fileName]]</paper-radio-button>
<br />
</template>
</paper-radio-group>
<div class="buttons">
<paper-button dialog-dismiss>Cancel</paper-button>
<paper-button dialog-confirm autofocus disabled id="playButton" on-tap="playPressed">Play</paper-button>
</div>
</paper-dialog>
</template>
<script>
Polymer({
is: 'opr-play-file-dialog',
_selectedPosition: -1,
_playPositionCallback: null,
clearSelectedPosition:() => {
this.positionRadio.select(-1);
this._selectedPosition = -1;
this.playButton.disabled = true;
},
open: (playPositionCallback) => {
this._playPositionCallback = playPositionCallback;
console.log(this._selectedPosition);// is undefined
// if this is un-commented, throws an error as it not being a function
//this.clearSelectedPosition();
this.positionRadio.hidden = true;
this.playFileLoadingSpinner.hidden = false;
this.playFileDialog.open();
this.currentPlaylistAjax.generateRequest();
},
handleResponse:() => {
//this.clearSelectedPosition();
this.positionRadio.hidden = false;
this.playFileLoadingSpinner.hidden = true;
},
positionOnChange: (e) => {
const target = e.target;
this._selectedPosition = target.value;
this.playButton.disabled = false;
},
playPressed: (e) => {
if (this._selectedPosition < 1) {
return;
}
this._playPositionCallback(this._selectedPosition);
},
});
</script>
</dom-module>
、私はclearSelectedPosition
を呼び出すことはできません:ダイアログ罰金を開きますが、ここで私のダイアログ要素である
<dom-module id="opr-remote">
<template>
<paper-button raised on-tap="onTap" id="play-file">Play file</paper-button>
<opr-play-file-dialog id="playFileDialogElement"></opr-play-file-dialog>
</template>
<script>
Polymer({
is: 'opr-remote',
onTap: (e) => {
const id = e.target.getAttribute('id');
if ('play-file' === id) {
this.playFileDialogElement.open((playPosition) => {
console.log('play position: ' + playPosition);
});
}
},
});
</script>
</dom-module>
:
は、ここに私の親要素です。次に、私は位置を取得するコールバックを使用していますが、私はこれが正しい方法だとは思わない。