Group wise动态单选按钮获取选择Angular 4

时间:2018-05-14 14:47:36

标签: angular angular4-forms

我有一个json数组。通过迭代这个数组,我生成了复选框和无线电输入的组合。但问题是,当我移动到下一组时,选择一组单选按钮后,前一组单选按钮被取消选择。

我正在提供代码段: -

private modalArray = [
    { 
      id:1,
      name:'Bread Type',
      choicetype:"single",
      child:[
          {
            id:11,
            name:"Roasted Bread",
            value:"roasted",
            default:"roasted"
          },
          {
            id:12,
            name:"Multi grain Bread",
            value:"multigrain",
            default:""
          },
          {
            id:13,
            name:"Bishakto Bread",
            value:"bishakto",
            default:""
          }
      ]
    }, 

    { 
      id:3,
      name:'Topins Type',
      choicetype:"single",
      child:[
          {
            id:31,
            name:"Green Capcicum",
            value:"green",
            default:""
          },
          {
            id:32,
            name:"Yellow Capcicum",
            value:"yellow",
            default:""
          }
      ]
    }
  ];

在我的视图组件中: -

<div class="pop-mid">
                <div class="pop-tab-block">

                    <div *ngFor="let modal of modalArray" class="pop-tab-item">
                        <h2 class="main-subheading-type2">{{ modal.name }}</h2>

                        <ul>
                            <li *ngFor="let choice of modal.child">
                                <span class="food-type ft-veg"></span>
                                <div *ngIf="modal.choicetype=='single'" class="rsnt-opt-chk">


                                    <input 
                                        type="radio" 
                                        (change)="onChange(modal.id,choice.id, $event.target.checked,modal.choicetype)"
                                        name="choices"
                                    />
                                    <label>{{ choice.name }}</label>
                                </div>

                            </li>
                        </ul>

                    </div>
                </div>
            </div>

我该如何解决这个问题?提前致谢

1 个答案:

答案 0 :(得分:1)

你可以试试这个: df.loc[i,4:7]=df.loc[i,0:3] df.loc[i,8:11]=df.loc[i,0:3] 代码中的<input type="radio" (change)="onChange(modal.id,choice.id, $event.target.checked,modal.choicetype )" name="{{'choices'+modal.id}}" />