0

需要一些有关 IONIC 5 的帮助..我想为每个 ion 项目添加点击功能...我希望在点击任何 raio 项目时出现一个表单

我曾尝试使用 (ng-click)="selection(item.id)" 并尝试过

似乎没有一个按预期工作。

<div class="cat-holder">
        <ion-radio-group>
          <div class="rad-item" text-center>
            <ion-item text-center>
              <img src="assets/imgs/dstv.png" alt="">
              <ion-radio value="transport"></ion-radio>
            </ion-item>
            <ion-label>Item1</ion-label>
          </div>

          <div class="rad-item" text-center>
            <ion-item text-center>
              <img src="assets/imgs/bill1.svg" alt="">
              <ion-radio value="bill"></ion-radio>
            </ion-item>
            <ion-label>Item2</ion-label>
          </div>

        </ion-radio-group>
  </div>
4

2 回答 2

0

我终于能够使用以下方法为 IONIC 5 完成它

在 .ts 文件上，我这样做了，在 ion-radio-group 上使用 (ionChange)="segmentChanged($event)"

类别：任何=“天”；

然后在 HTML ..希望它可以帮助某人

          <ion-label>Select Biller</ion-label>
           <div class="cat-holder">
              <ion-radio-group (ionChange)="segmentChanged($event)" 
                  [value]="category">

              <div class="rad-item" text-center >
                <ion-item text-center>
                  <img src="assets/imgs/dstv.png" alt="">
                  <ion-radio value="transport" name="transport" ></ion-radio>
                </ion-item>
                <ion-label>Dstv</ion-label>
              </div>
              <div class="rad-item" text-center>
                <ion-item text-center>
                  <img src="assets/imgs/gotv.png" alt="">
                  <ion-radio value="Gotv" name="gotv" ></ion-radio>
                </ion-item>
                <ion-label>Gotv</ion-label>
              </div>


            </ion-radio-group>
          </div>
于 2020-03-22T14:36:54.450 回答
0

使用 (click)="method you want" 而在 ionic 5 中，不推荐使用 text-center，我认为您可以改用 class="ion-text-center"

在你的 ts 文件中：

export yourclass{
selectedValue:any;
}

在你的 html 文件中：

<div class="cat-holder">
        <ion-radio-group>
          <div class="rad-item" text-center>
            <ion-item text-center>
              <img src="assets/imgs/dstv.png" alt="">
              <ion-radio [(ngModel)]="selectedValue"  value="transport"></ion-radio>
            </ion-item>
            <ion-label>Item1</ion-label>
          </div>

          <div class="rad-item" text-center>
            <ion-item text-center  >
              <img src="assets/imgs/bill1.svg" alt="">
              <ion-radio [(ngModel)]="selectedValue" value="bill"></ion-radio>
            </ion-item>
            <ion-label>Item2</ion-label>
          </div>

        </ion-radio-group>
  </div>

<div *ngIf="selectedValue=='value u want from radio"></div>
于 2020-03-22T10:56:08.003 回答