Question

我想在Polymer和Dart中使用组件库（Kendo UI），并在HTML模板文件中的普通JS中尽可能多地保留组件初始化。（剑道lib没有Dart绑定，我也不想开辟这条线索......）现在，使用这些组件需要运行一些JavaScript来初始化div。我遇到的困难是让脚本标签能够看到阴影DOM中的元素，并在聚合物初始化后的适当时间运行。

通过在Dart Polymer类ready（）函数中获取div并使用JS上下文回调到我的模板以在那里运行JS函数，将div传递给它，我找到了一个合理的解决方案。例如

e.g。在一个自定义标记的模板文件中我有：

<script type='text/javascript'>
    function initKendo(panel) {
        $(panel).kendoPanelBar({
            expandMode: 'multi'
        });
    }
</script>

来自Dart我称之为：

ready(){    
    js.context.initKendo( $['myPanel'] );
}

这确实有效，但感觉就像是黑客，我担心自己可能会遇到什么问题。

我的问题是：

是否有更直接的方法在HTML模板文件的脚本标记内完成此操作（没有回调）。我已经尝试注册Polymer.ready（）并使用shadowDom获取来查询我的div，它尝试工作但我的所有样式都因某些原因而丢失了......我担心混合普通聚合物和Dart Polymer可能不好。
这种一般方法是否可行？我可以放入Polymer模板文件的限制是什么，以及我可能遇到的第三方库与阴影dom处理不好有什么问题？到目前为止，如果我只是在我的模板文件顶部导入它（例如libs和样式），那么简单的东西似乎有效。
如果我想在此时使用带Dart的第三方lib作为控制器逻辑，我还有哪些其他选项？如果不是聚合物，我应该如何分解我的HTML？

Answer 1

1）您应该能够从Dart调用jQuery而无需创建JS函数How to call a jQuery function from Dart?

当您使用JavaScript访问shadowDOM时，您的样式会丢失，这很奇怪。你能提供一些代码吗？

2）不支持shadowDOM的全局样式会造成一些麻烦。使用Bootstrap，它通常有助于链接每个Polymer元素内的样式文件。当样式或JavaScript必须跨越元素内部的阴影边界时，这将不起作用（当你有一种后代选择器，其中祖先在shadowDOM之外，而后代在其中）

3）我猜最好的选择是使用Angular.dart。 Angular.dart支持没有shadowDOM的组件

在模板中使用JS的Polymer Dart（使用第三方库）

1 个答案: