Question

我想构建一个Polymer 2.0自定义元素DOM树，但我想根据每个子元素的标记类型填充子元素（插槽），所以当我编写HTML以使用我的自定义元素时strong>不要想写：

  <group>
    <title slot="title">admins</title>
    <description slot="description">some description</description>
    <users slot="users">
      <user slot="user">
        <name slot="name">Amy</name>
        <dept slot="dept">Widgets</dept>
        <phone slot="phone">1234</phone>
      </user>
      <user slot="user">
        <name slot="name">Bill</name>
        <dept slot="dept">Sprockets</dept>
        <phone slot="phone">5678</phone>
      </user>
      <user slot="user">
        <name slot="name">Chris</name>
        <dept slot="dept">Rachets</dept>
        <phone slot="phone">1357</phone>
      </user>
    </users>
  </group>

这应该可以在Polymer 2.0中使用命名槽，但如果你有一个深层树，每个层都有几个属性，你会发现它非常麻烦和冗余。

我真正想做的只是写：

  <group>
    <title>admins</title>
    <description>some description</description>
    <users>
      <user>
        <name>Amy</name>
        <dept>Widgets</dept>
        <phone>1234</phone>
      </user>
      <user>
        <name>Bill</name>
        <dept>Sprockets</dept>
        <phone>5678</phone>
      </user>
      <user>
        <name>Chris</name>
        <dept>Rachets</dept>
        <phone>1357</phone>
      </user>
    </users>
  </group>

基本上只是XML。对我来说，这似乎比第一个例子更容易使用。正如您所看到的那样，随着树的深入，树变得越来越深，它变得非常拥挤和混乱。

所以我的问题是如何在Polymer 2.0中执行后一个示例？它甚至可能吗？在我看来，这将是Polymer的主要用例，因此确实应该有一种实现它的方法。我找到的最接近的是这个网页，但它并没有真正做到我想要的，因为每个自定义元素模板限制为一个“默认”插槽：

https://developers.google.com/web/fundamentals/getting-started/primers/shadowdom#slots

Answer 1

我不确定你想在这里做什么，你确定你真的不想要CounterRecord.pluck(:data).each_with_index.map { |c,i| a[0] == c ? c : (a[i-1].to_i - c).abs }吗？在我看来，您只想根据您发布的XML列出一些元素。

聚合物2.0和多个插槽

1 个答案: