Polymer 1.0 Type Extension Select Element

Asked By: Anonymous

My Polymer 1.0 Type Extension Select Element does not display correctly when I insert the below code into the Polymer Starter Kit. The element displays as a select arrow with no options. I appreciate your help!

Contents of my-products.html (this file resides in the “my-products” folder in a similar way that my-list.html resides in the “my-list” folder):

<dom-module id="my-products">
    <template>
        <select>
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="mercedes">Mercedes</option>
            <option value="audi">Audi</option>
        </select>
    </template>

    <script>
        Polymer({
            is: 'my-products',
            extends: 'select'
        });
    </script>
    </dom-module>

Elements.html code:

<link rel="import" href="my-products/my-products.html">

Index.html code:

<select is="my-products"> </select>

Solution

Answered By: Anonymous

You don’t need the <select> inside the template since the way you are using it already implies a wrapping <select>, overall yielding:

<select><select>(options)</select></select>

This works instead:

<dom-module id="my-products">
    <template>
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="mercedes">Mercedes</option>
            <option value="audi">Audi</option>
    </template>

    <script>
        Polymer({
            is: 'my-products',
            extends: 'select'
        });
    </script>
</dom-module>

If you want to have <select> in the template remove the “extends” property from your Polymer initialization object and just use <my-products></my-products> in index.html.

techinplanet staff

techinplanet staff


Windows 10 Kaufen Windows 10 Pro Office 2019 Kaufen Office 365 Lizenz Windows 10 Home Lizenz Office 2019 Home Business Kaufen windows office 365 satın al follower kaufen instagram follower kaufen porno