dropdown（下拉框）

更改模板，使用button作为触发器

{{value}}

    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script src="../avalon.js"></script>
        <script type="text/javascript">
            require('dropdown/avalon.dropdown.js', function() {
                avalon.ready(function() {
                    avalon.define('dropdown', function(vm) {
                        vm.value = 'value5';
                        vm.dropdown = {
                            getTemplate: function(template) {
                                var templates = template.split("MS_OPTION_TEMPLATE");
                                templates[0] = '
';
                                return templates.join("MS_OPTION_TEMPLATE");
                            }
                        };
                    });
                    avalon.scan();
                });
            });
        </script>
    </head>
    <body>
    <div class="frame" ms-controller="dropdown">
        <h2>dropdown（下拉框）</h2>
        <p>使用html配置并使用duplex绑定</p>
        <select ms-widget="dropdown"
                ms-duplex="value">
            <optgroup label="group1">
                <option value="value1">Value 1</option>
                <option>textValue</option>
                <option label="label" value="labelValue">with label</option>
                <option value="value2" selected>Value 2</option>
                <option value="value3">Value 3</option>
            </optgroup>
            <optgroup label="group2">
                <option value="value4">Value 4</option>
                <option value="value5" disabled>Value 5</option>
                <option value="value6">Value 6</option>
            </optgroup>
        </select>
        <p>{{value}}</p>
    </div>
    </body>
    </html>