在离子2中检查两个不同列表的单选按钮

Question

Ionc2 Radio Group

如图所示，我想要两个无线电组列表。 但是当我尝试实现它时，只有一个选项被选中了两个列表组。

请帮我实现同样的目标。

Answer 1

您使用2种不同的formGroup吗？如果没有，你应该，这是一个：

 <form (submit)="doSubmit($event)" [formGroup]="langForm">
    <ion-list radio-group formControlName="langs">

      <ion-list-header>
        Language
      </ion-list-header>

      <ion-item>
        <ion-label>Go</ion-label>
        <ion-radio value="golang" checked="true"></ion-radio>
      </ion-item>
      <ion-item>
        <ion-label>Rust</ion-label>
        <ion-radio value="rust"></ion-radio>
      </ion-item>

...

Answer 2

将名称属性添加到<ion-radio>做了神奇的

                         <ion-list radio-group no-lines >
                              <ion-item>
                                  <ion-label>1</ion-label>
                              <ion-radio name="prithivi">1</ion-radio>
                              </ion-item>
                              <ion-item>
                                  <ion-label>2</ion-label>
                              <ion-radio name="prithivi" >2</ion-radio>
                              </ion-item>
                          </ion-list>

                          <ion-list radio-group no-lines >
                              <ion-item>
                                  <ion-label>3</ion-label>
                              <ion-radio name="abi">3</ion-radio>
                              </ion-item>
                              <ion-item>
                                  <ion-label>4</ion-label>
                              <ion-radio name="abi" >4</ion-radio>
                              </ion-item>
                          </ion-list>