Question

我想扩展内容并添加包含数据绑定的新dom元素。在示例中运行添加新项，但数据绑定不起作用。有可能解决我的问题吗？

<polymer-element name="wizard">
    <template>
        <style>
            :host {
                display: block;
            }

            :host #pages section {
                position: static;
            }

        </style>

        <core-animated-pages id="pages"
                             transitions="slide-from-right"
                             selected="{{selectedPageIndex}}">
            <content id="content"></content>
        </core-animated-pages>
    </template>

    <script>
        Polymer({
            attached: function() {
                var nodes = this.$.content.getDistributedNodes();

                for(var i = 0; i < nodes.length; i++) {
                    if(nodes[i] instanceof HTMLElement) {
                        var el = nodes[i].querySelector('div div');
                        el.innerHTML = el.innerHTML + '<button on-tap="{{nextPage}}">Next</button>';
                    }
                }
            },

            selectedPageIndex: 0,

            previousPage: function () {
                this.$.pages.selectPrevious(true);
            },

            nextPage: function () {
                this.$.pages.selectNext(true);
            }
        });
    </script>
</polymer-element>

Answer 1

我终于找到了问题的原因。

TL; DNR

添加

this.eventController = this;

在domReady处理程序的最开头。那个 mystically 会使技巧和事件处理程序受到约束和处理。

我将此视为当前Polymer实施中的错误，并将其报告给Polymer团队。问题的原因是findController中的polymer.js:10696功能与版本0.5.4相同。当调度程序查找事件处理程序时，它会迭代事件目标的父项，直到定义了eventController属性的父项。不幸的是，正在为lightFromTemplate函数正确处理此属性。当shadow DOM与injectBoundHTML绑定时，在当前实现中忘记了这个赋值。

实时预览：http://plnkr.co/edit/67WwbKmqsJRmsdXCbgbb?p=preview

NB 请注意，网络组件必须以内部连字符命名。 my-wizard是一个正确的名称，而wizard则不是。

如何修改元素中的现有<content>？</content>

1 个答案: