select 选项更改不保存无线电输入中的值

Question

I have a list of elements that, selected via a radio input, must output the [value] . The problem is that the select of choice of the value does not find me the secondary value when I go to change the select (always remains the value of prezzoRiepilogo instead of prezzoRiepilogoTwo , when i change). Why? How can I fix it?

<ul class="list-group">
               <li class="list-group-item" *ngFor="let interventoStrutturale of interventi">
                   <td style="float: left;">{{interventoStrutturale.intervento.codice}} {{interventoStrutturale.variante}} - {{interventoStrutturale.intervento.descrizione}}<br>

                       <select [(ngModel)]="interventoStrutturale.tipo_sup">
                           <option disabled value="1">Selection one</option>
                           <option value="2">Selection two</option>
                           <option value="3">Selection three</option>
                       </select>
</td>

                   <td style="float: right;" [ngSwitch]="interventoStrutturale.tipo_sup">

                       <label class="form-check-inline" *ngSwitchCase="interventoStrutturale.tipo_sup == 2">
                       <input class="form-check-input" type="radio" name="radio"
                           [value]="interventoStrutturale.prezzoRiepilogo" (change)="onChangeIntervento($event.target.value)">
                     </label>

<label class="form-check-inline" *ngSwitchCase="interventoStrutturale.tipo_sup == 3">
                       <input class="form-check-input" type="radio" name="radio"
                           [value]="interventoStrutturale.prezzoRiepilogoTwo" (change)="onChangeIntervento($event.target.value)">
                     </label>

                     <label class="form-check-inline" *ngSwitchDefault>
                       <input class="form-check-input" type="radio" name="radio"
                           [value]="interventoStrutturale.prezzoRiepilogo" (change)="onChangeIntervento($event.target.value)">
                     </label>
                   </td>
               </li>
           </ul>  
           

onChangeIntervento(intervento: number) {
   this.prezzoStrutturale = intervento
   this.elementoSelezionato = []
   this.interventi.forEach(c => {
     if(this.prezzoStrutturale == c.prezzoRiepilogo) {
       this.elementoSelezionato.push(c)
     } 
     if(this.prezzoStrutturale == c.prezzoRiepilogoTwo) {
       this.elementoSelezionato.push(c)
     }
   })
}

Answer 1

I think you do not apply SwitchCase correctly. Try it this way:

<td style="float: right;" [ngSwitch]="interventoStrutturale.tipo_sup">

    <label class="form-check-inline" *ngSwitchCase="2">
        <input class="form-check-input" type="radio" name="radio"
                       [value]="interventoStrutturale.prezzoRiepilogo" (change)="onChangeIntervento($event.target.value)">
    </label>

    <label class="form-check-inline" *ngSwitchCase="3">
        <input class="form-check-input" type="radio" name="radio"
                       [value]="interventoStrutturale.prezzoRiepilogoTwo" (change)="onChangeIntervento($event.target.value)">
    </label>

    <label class="form-check-inline" *ngSwitchDefault>
        <input class="form-check-input" type="radio" name="radio"
                       [value]="interventoStrutturale.prezzoRiepilogo" (change)="onChangeIntervento($event.target.value)">
    </label>