动态菜单纸质项目

Question

我目前正在使用纸质下拉菜单、纸质列表框和纸质项目 Web 组件来尝试创建列表。代码如下：

<paper-dropdown-menu label="Assigned" vertical-align>
 <paper-listbox attr-for-selected="id" class="dropdown-content" fallback-selection="default" selected="{{assignedFilter}}">
  <paper-item id="default">Select Configs</paper-item>
  <paper-item id="displayAssignedConfigs">TRUE</paper-item>
  <paper-item id="displayAllConfigs">ALL</paper-item>
 </paper-listbox>
</paper-dropdown-menu>

在此示例中，有 3 个具有静态文本的纸张项目。我希望根据我正在发出的 Ajax 请求的响应动态生成列表中的项目数和这些项目中的文本。

以前做过这种事情的任何想法或开发人员都会有很大的帮助。我正在使用 Polymer 1.0 进行编程。

Answer 1

使用dom-repeat 辅助元素：

<paper-dropdown-menu label="Assigned" vertical-align>
  <paper-listbox attr-for-selected="id" class="dropdown-content" fallback-selection="default" selected="{{assignedFilter}}">
    <template is="dom-repeat" items="{{ajaxResponse}}">        
      <paper-item id="{{item.id}}">{{item.label}}</paper-item>
    </template>
  </paper-listbox>
</paper-dropdown-menu>

以上假设你的ajax以如下形式返回响应：

[
  {id: "default", label: "Select Configs"},
  {id: "displayAssignedConfigs", label: "TRUE"},
  {id: "displayAllConfigs", label: "ALL"},
  ...
]