【发布时间】：2014-11-06 10:25:41
【问题描述】：
所以我决定最好将过滤器与我的 PolymerTable 分开。我为我的过滤器创建了一个 PolymerElement。我想在 FilterElement 内显示表格的一部分，因为它应该显示为带有表格的引导面板。 http://getbootstrap.com/components/#panels-tables 我不确定我是否正确使用了内容标签，或者这是否可能我正在尝试。 我的代码看起来有点像这样：
<!-- index.html -->
<!-- ... -->
<poly-table></poly-table>
<!-- ... -->
<!-- poly-table.html -->
<polymer-element name="poly-table">
<template>
/* style */
<div id="table_cont">
<poly-filter>
<table class="table">
/* ... stuff inside ... */
</table>
</poly-filter>
</div>
</template>
</polymer-element>
<!-- poly-filter.html -->
<polymer-element name="poly-filter">
<template>
/* style */
<div id="filter_cont" class="panel">
<div class="panel-heading">
Filter
</div>
<div class="panel-body>
<!-- Filter Content here -->
</div>
<content></content>
</div>
</template>
</polymer-element>
我的表格将呈现在我的过滤器之外和上方，而不是在过滤器下方...
我在 PolyFilter 中覆盖了 parseDeclaration，因此 <poly-filter> 元素在 light DOM 中呈现。
parseDeclaration(elementElement) {
var template = fetchTemplate(elementElement);
if (template != null) {
lightFromTemplate(template);
}
}
【问题讨论】：
-
Bootstrap CSS 不适用于 ShadowDOM。您是否在不应用 Bootstrap CSS 的情况下尝试过？对我来说，到目前为止似乎还不错。
<table class="table"...>应该在<poly-filter>元素有<content>元素的地方渲染。 -
没有引导它似乎工作。我目前正在使用一种解决方法来使它与此一起使用。pastebin.com/NKQJbmi8我真的不知道它的作用...但是让 Bootstrap 与我的 Polymer Elements 一起使用
-
我听说在没有 ShadowDOM 的情况下支持 Polymer 元素，但从未使用过它，据我记得它有一些限制，但我不知道任何细节。
-
好吧，Bootstrap 的 Javascript 部分没有按预期工作（如 ButtonDropdowns），但在 Dart 中这样做并没有真正的问题。我尝试使用 Dart 查询过滤器中的内容标签并将该表附加到那里，它完成了工作......这不是最好的解决方案，但它完成了工作......
-
但这似乎也不完全奏效。我没有像在引导程序中那样渲染，它似乎在面板的主体内......
标签： twitter-bootstrap dart polymer dart-polymer content-tag