Question

我正在使用Polymer作为项目。我有通过this.innerHTML加载的html元素。我想将这些元素的数据绑定到主页面。我不知道这是否可能。这是设置：我有一个主要应用程序，它将元素绑定到我的html元素的<html-echo>属性。然后，此元素应使用.innerHTML加载html（否则html不会被解析）。从那个被注入的元素我想绑定它的数据。这可能吗？

主要-应用

<polymer-element name="main-app">
    <template>
        <html-echo html="{{htmlToBeEchoed}}"></html-echo>
    </template>
    <script>
        Polymer('main-app', {
            htmlToBeEchoed = "<test data='{{data}}'></test>";
        });
    </script>
</polymer-element>

HTML-echo.html

<polymer-element name="html-echo" attributes="html data">
    <script>
        Polymer('html-echo', {
          htmlChanged: function() {
            // WARNING: potential XSS vulnerability if `html` comes from an untrusted source :()
            this.innerHTML = this.html;
          }
        });
    </script>
</polymer-element>

的test.html

<polymer-element name="test" attributes="data">
    <script>
        Polymer('test', {
            data: 5
        });
    </script>
</polymer-element>

Answer 1

是的，使用injectBoundHTML。来自https://github.com/Polymer/docs/issues/607：

/**
* Inject HTML which contains markup bound to this element into
* a target element (replacing target element content).
* @param String html to inject
* @param Element target element
*/
injectBoundHTML: function(html, element)

在聚合物元素中，而不是

el.innerHTML = html;

做

this.injectBoundHTML(html, el);

聚合物将数据绑定到使用innerHTML加载的元素

1 个答案: