Creating a Web Component with Polymer - Part 1 - 03 List

my-listfilter.html

<link rel="import" href="../polymer/polymer.html">
<!--
`my-listfilter`
A filterable list component

@demo demo/index.html
-->
<dom-module id="my-listfilter">
    <template>
        <style>
            :host {
                display: block;
            }
            .hidden {
                display: none;
            }
        </style>
        <input value="{{prop1::input}}" />
        <h2>Hello [[prop1]]</h2>
        <ul id="list">
            <li>Hypertext Markup Language</li>
            <li>Cascading Style Sheets</li>
            <li>Javascript</li>
            <li>Web Components</li>
            <li>Polymer</li>
            <li>Web Browser</li>
            <li>Mentally Friendly</li>
        </ul>
    </template>
    <script>
        Polymer({
            is: 'my-listfilter',
            properties: {
                prop1: {
                    type: String,
                    value: 'my-listfilter',
                },
            },
        });
    </script>
</dom-module>