javascript - Polymer Translation 组件 -> 使用 shady 但不使用 Shadow dom

Question

我有以下组件:

<dom-module id="t-t">
    <template>
        <span id="textSpan"></span>
    </template>

    <script>
        Polymer({
            is: "t-t",
            properties: {
            },
            ready: function () {
                var content = Polymer.dom(this).childNodes[0].textContent;
                this.$.textSpan.appendChild(document.createTextNode(commonClient.getTranslation(content)));
            }
        });
    </script>
</dom-module>

该组件可以与 shady dom 一起正常工作!

我在 ag-grid 的标题中使用它!有了阴影，结果看起来像这样

<span class="ag-header-cell-text">
    <t-t>
        <span id="textSpan" class="style-scope t-t">Materialstatus</span>
    </t-t>
</span>

如果我使用shadow dom，它看起来像这样

<span class="ag-header-cell-text">
    <t-t>
    #shadow-root
        <span id="textSpan">Prüfe Mindestlagerdauer</span>
    Material_CheckMinStay
    </t-t>
</span>

有人有什么想法吗？

Answer 1

我已经修复了它。

问题不是我的翻译组件，问题是我在另一个 polymer 组件中使用了网格!启用“shadow”后，组件无法再访问其样式(因为它们是在index.html中导入的)