所以我试图动态生成一个从 AJAX 数据源填充的纸质下拉菜单,使用下面的代码效果很好:
<polymer-element name="my-element" attributes="selected">
<template>
<core-ajax auto url="/api/items/" response="{{items}}" handleAs="json"></core-ajax>
<paper-dropdown-menu selected="{{selected}}">
<template repeat="{{items}}">
<paper-item name="{{id}}" label="{{name}}"></paper-item>
</template>
</paper-dropdown-menu>
</template>
但是,如果我将初始选定项设置为已发布属性的值,或者我在“就绪”回调中设置的值,则在加载项时不会选择下拉菜单项:
<script>
Polymer({
publish: {
selected: null
}
});
</script>
</polymer-element>
我知道发生这种情况是因为在绑定(bind)下拉列表中的模板之前设置了“selected”属性,但我的问题是是否有办法 1)将“selected”属性更改推迟到模板绑定(bind)之后或 2) 以其他方式可靠地为下拉菜单设置初始选择的值?
最佳答案
一种选择是在数据可用之前不呈现下拉菜单。
例如:http://jsbin.com/piyogo/13/edit
<polymer-element name="foo-drop">
<template>
<core-ajax auto
url="http://www.json-generator.com/api/json/get/bJMeMASvTm?indent=2"
response="{{items}}"
handleas="json">
</core-ajax>
<template if="{{items}}">
<paper-dropdown-menu selected="{{selected}}">
<template repeat="{{item in items}}">
<paper-item label="{{item.name}}"></paper-item>
</template>
</paper-dropdown-menu>
</template>
</template>
<script>
Polymer({
publish: {
selected: null
}
});
</script>
</polymer-element>
<foo-drop selected="2"></foo-drop>
关于drop-down-menu - 动态生成的 paper 下拉菜单初始选择问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26635287/