paper-radio-group buttons inside a template possible?

Question

I'm creating a project with Polymer and have the following code:

<paper-radio-group>
    <template repeat="{{answer in answers}}">
        <p>
            <paper-radio-button name="{{answer.choice}}" label="{{answer.choice}}"></paper-radio-button>
        </p>
    </template>
</paper-radio-group>

I have a list of answers that I want to use in the paper-radio-group. Displaying this works fine. Every item in the answers array is displayed as a paper-radio-button.

The problem is that they are not connected to each other. So, when selecting one paper-radio-button, another is not deselected. This is probably because the paper-radio-group tag is outside the template tag. But placing it inside would make it repeat like the paper-radio-button and that's not going to work either.

Is there a way to get this to work? Or is it not possible?

Answer 1

The <paper-radio-group> expects <paper-radio-button> as it's children. When you wrap them in other elements like <p> the <paper-radio-group> can't manage the state.
The <template> element is is not actually included in the DOM and doesn't get in the way when the elements are rendered.