Select 只有两行纸张下拉菜单中的第一项

Question

我正在使用 Polymer 2.0 预览版。我有 <paper-dropdown-menu> 这样的：

<paper-dropdown-menu label="Your devices..." style="margin: 0;">
    <paper-listbox slot="dropdown-content" selected="1">
        <paper-icon-item>
            <iron-icon icon="hardware:phone-android" slot="item-icon"></iron-icon>
            <paper-item-body two-line>
                <div>PLAY LGE LG-H440n</div>
                <div secondary>Last sync: Jan 9, 2014</div>
            </paper-item-body>
        </paper-icon-item>
        <paper-icon-item value="PLAY ASUS Nexus7 2012 WIFI">
            <iron-icon icon="hardware:tablet-android" slot="item-icon"></iron-icon>
            <paper-item-body two-line>
                <div>PLAY ASUS Nexus7 2012 WIFI</div>
                <div secondary>last sync: Jan 9, 2014</div>
            </paper-item-body>
        </paper-icon-item>
    </paper-listbox>
</paper-dropdown-menu>

当我 select 例如第一项时，我得到的是

PLAY LGE LG-H440nLast sync: Jan 9, 2014

我想要的是

PLAY LGE LG-H440n

我只需要显示第一行。我试图将 value 设置为 <paper-icon-item> 但它不起作用。如果不创建自己的组件，我该怎么做？有可能吗？

Answer 1

好的，我知道了。根据 paper-dropdown-menu.html 文件中的文档：

<paper-input
    type="text"
    invalid="[[invalid]]"
    readonly
    disabled="[[disabled]]"
    value="[[selectedItemLabel]]"
    placeholder="[[placeholder]]"
    error-message="[[errorMessage]]"
    always-float-label="[[alwaysFloatLabel]]"
    no-label-float="[[noLabelFloat]]"
    label="[[label]]">

...

/**
 * The derived "label" of the currently selected item. This value
 * is the `label` property on the selected item if set, or else the
 * trimmed text content of the selected item.
 */
 selectedItemLabel: {
     type: String,
     notify: true,
     readOnly: true
 }

我需要在 <paper-icon-item> 元素上设置 label。

Select 只有两行纸张下拉菜单中的第一项

Select only first item from two-line paper-dropdown-menu

polymer

polymer-2.x