为了保存和设置选择,我一直在努力将下拉菜单选择绑定到对象的动态属性。
因此,我有一个节标题列表(i的列表),其中每个标题都有一个问题列表(j的列表),每个问题都有一个答案,该答案保存为文本,但可以是列表(opt或list of)。选择)。
这是我当前代码的结构。
<template is="dom-repeat" items="{{dataArray}}" as="dataItem" index-as="sectionIndex">
<div>
<h4>[[dataItem.name]]</h4>
<div id="[[dataItem.id]]">
<div>
<template id="questionList" is="dom-repeat" items="{{dataItem.questions}}" as="questionItem" index-as="questionIndex">
<div>
<!-- Label -->
<div>[[questionItem.question]]</div>
<!-- Control -->
<div>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'NumericInput')]]">
</template>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'TextInput')]]">
</template>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'TextArea')]]">
</template>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'MoneyInput')]]">
</template>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'CheckBox')]]">
</template>
<template is="dom-if" if="[[_isEqual(questionItem.fieldType, 'Select')]]">
<paper-dropdown-menu-light" vertical-offset="60">
<paper-listbox class="dropdown-content" attr-for-selected="option" on-selected-item-changed="_selectedOptionChanged">
<paper-item d-section-index$="[[sectionIndex]]" d-question-index$="[[questionIndex]]" d-option-index$="-1" option="ns">No Selection</paper-item>
<template id="optionList" is="dom-repeat" items="[[questionItem.selectableOptions]]" as="optionItem" index-as="optionIndex">
<paper-item d-section-index$="[[sectionIndex]]" d-question-index$="[[questionIndex]]" d-option-index$="[[optionIndex]]" option$="[[optionItem]]">[[optionItem]]</paper-item>
</template>
</paper-listbox>
</paper-dropdown-menu-light>
</template>
<template is="dom-if" if="[[_isEqual(item.fieldType, 'Label')]]">
</template>
<template is="dom-if" if="[[_isEqual(item.fieldType, 'DateTimePicker')]]">
</template>
<template is="dom-if" if="[[_isEqual(item.fieldType, 'MultiSelect')]]">
</template>
</div>
</div>
</template>
</div>
</div>
</div>
</template>
我通常要做的是在paper-listbox
下,我可以将selected
属性设置为对象属性,例如selections.A1
。现在的问题是我不知道结构,因为不同的环境对于它们的部分,问题和选项会有不同的金额。
我的动态对象遵循以下几行内容,它是在接收数据时动态建立的,并且在聚合物元素的属性中声明时未初始化。
dataSelections
{
//i-j: opt
"0-0": null,
"0-1": null,
"0-2": null,
"1-0": null,
"2-0": null,
...
}
在Polymer中,我有一个临时解决方案,在此解决方案中,我可以获取当前的选择:
_selectedOptionChanged: function (event)
{
var selectedOption = event.currentTarget.selectedItem;
var sectionIndex = selectedOption.getAttribute("d-section-index");
var questionIndex = selectedOption.getAttribute("d-question-index");
var optionIndex = selectedOption.getAttribute("d-option-index");
var section = this.dataArray[sectionIndex];
var question = section.questions[questionIndex];
var option = question.selectableOptions[optionIndex];
this.dataSelections[sectionIndex + "-" + questionIndex] = option;
}
我现在正坐在一个我不知道如何将值设置为已保存值的问题上。
我尝试以下添加selected
属性,但是它不起作用。我对此并不感到惊讶,但我希望通过这种方式将选项绑定到对象的属性。
selected="{{'dataSelections.' + sectionIndex + '-' + questionIndex}}"
有没有一种方法可以动态绑定paper-listbox
的{{1}}属性,就像我需要根据以前的索引建立每个选定的索引一样?