0

我正在尝试使用 Iron-form,但我无法在 Chrome 上访问表单的非本地元素。

<dom-module id="e404-view">
    <template>
        <style>
            :host {
                display: block;

                padding: 10px 20px;
            }

        </style>

        <form id="step1Form" is="iron-form">
            <input>
            <paper-input></paper-input>
        </form>

        You hit a 404. <a href="/home">Head back to home</a>
    </template>

    <script>
        Polymer({
            is: 'e404-view',

            ready: function () {
                var form = this.$.step1Form;
//                console.log(form.elements);
                for (var el, i = 0; el = form.elements[i], i < form.elements.length; i++) {
                    console.log(el);
                }
            }
        });
    </script>
</dom-module>

这是一个包含表单的简单视图。当我在 Chrome 上遍历 form.elements 时,数组中只有一个输入。然而,这个例子在 Firefox 上运行得很好。

我正在构建一个应用程序,奇怪的是,当我在不同的项目中使用相同的视图时,一切正常。我认为应用程序中存在一些冲突或类似的东西。此视图通过应用程序中的铁页显示。但是我不确定为什么它可以在 Firefox 上运行。

我似乎无法找出问题所在,任何建议或提示将不胜感激。如果我不解决这个错误,我可能会删除表单并自己处理验证。

在此先感谢,扬

4

1 回答 1

1

我找到了解决方案。该问题是由位于 index.html 中的全局 Polymer 设置引起的。

这是有问题的部分:

    window.Polymer = {
        dom: 'shadow',
        lazyRegister: true
    };

当我注释掉 dom: 'shadow' 设置时,一切都开始工作了。

于 2016-12-12T16:06:42.150 回答