polymer - 将纸单选按钮(由 div 包裹)与纸单选组相关联？

Question

我可以关联多个 paper-radio-button通过让按钮成为 paper-radio-group 的直接子项来在组内.

<paper-radio-group selected="{{someProperty}}">
  <paper-radio-button name="foo">Foo</paper-radio-button>
  <paper-radio-button name="bar">Bar</paper-radio-button>
  <paper-radio-button name="baz">Baz</paper-radio-button>
</paper-radio-group>

但是，如果我包装 paper-radio-button 之一使用这样的 div，它会失去与该组的关联(因此可以选择该包装按钮和其他按钮之一)。这是一个问题，因为我想给那个按钮一个工具提示。

<paper-radio-group selected="{{someProperty}}">
  <paper-radio-button name="foo">Foo</paper-radio-button>
  <paper-radio-button name="bar">Bar</paper-radio-button>
  <div>
    <paper-radio-button name="baz">Baz</paper-radio-button>
    <paper-tooltip>Tooltip text for baz.</paper-tooltip>
  </div>
</paper-radio-group>

我尝试使用 for纸工具提示的属性，但这不会使工具提示仅在将鼠标悬停在该特定按钮上时出现。

我怎么能关联一个 paper-radio-button与 paper-radio-group没有按钮是一个直接的 child ？

Answer 1

要添加工具提示，请创建 id对于每个需要工具提示的单选按钮。然后您可以使用 for并引用 id .不需要包装器 div .

<paper-radio-group>
    <paper-radio-button id="foo" name="foo">Foo</paper-radio-button>
    <paper-tooltip for="foo">Tooltip text for foo.</paper-tooltip>
    <paper-radio-button id="bar" name="bar">Bar</paper-radio-button>
    <paper-tooltip for="bar">Tooltip text for bar.</paper-tooltip>
    <paper-radio-button id="baz" name="baz">Baz</paper-radio-button>
    <paper-tooltip for="baz">Tooltip text for baz.</paper-tooltip>
</paper-radio-group>

您可以在此 plunk 中找到工作演示.