Repeating variable with different values does not work

In the following example I have two variables: radio_num and radio_name.

I want to use this chunk of code several times on the same page, and simply change the value of the variable for each instance. The problem is that it doesn’t work. In-fact the resultant chunk doesn’t show on the page at all.

<dmx-value id="radio_num" dmx-bind:value="31"></dmx-value>
<dmx-value id="radio_name" dmx-bind:value="'data_security'"></dmx-value>

<div class="form-group row" dmx-bind:id="radio_name" is="dmx-radio-group">
  <legend class="col-sm-3 col-form-label" dmx-text="sc_menus.data.q_menus.where('menu_id', radio_num.value, '==')[0].label"></legend>
  <div class="col-sm-9">
    <div class="btn-group btn-group-toggle d-flex flex-wrap" is="dmx-repeat" data-toggle="buttons" dmx-bind:repeat="sc_menus.data.q_menus.where(`menu_id`, radio_num.value, '==')">
      <label class="btn btn-sm btn-outline-primary" for="input_{{menu_id}}_{{menu_list_id}}" dmx-class:active="menu_list_id == business_principal_sc.data.b_principal_q[0].data_security">
        <input class="custom-control-input" type="radio" dmx-bind:id="input_{{menu_id}}_{{menu_list_id}}" dmx-bind:value="menu_list_id" dmx-bind:name="radio_name.value" dmx-bind:checked="menu_list_id == business_principal_sc.data.b_principal_q[0].data_security">{{list_label}}
      </label>
    </div>
  </div>
</div>

How can I do this? I want to change Variables like this

<dmx-value id="radio_num" dmx-bind:value="35"></dmx-value>
<dmx-value id="radio_name" dmx-bind:value="'interior_mods'"></dmx-value>


<dmx-value id="radio_num" dmx-bind:value="48"></dmx-value>
<dmx-value id="radio_name" dmx-bind:value="'tyre_depths'"></dmx-value>