Question

我正在尝试在行尾添加一个带有按钮和复选框或单选框的离子列表。那是我的没有复选框/收音机的代码：

E1

它可以工作，我可以显示有关Item对象的任何信息。
如果我添加复选框或单选框，则我的信息消失并且按钮单击不起作用（总是复选框更改事件触发器）。

E2

我如何在同一行中有一个按钮和复选框？

Answer 1

您可以使用网格系统将元素放在同一行上：

<ion-grid>
  <ion-row>
    <ion-col>
     <button ion-item (click)="editItem(i, item)">
      <ion-avatar item-start>
        <img [src]="item.photo" />
      </ion-avatar>
     <h2>{{item.name}}</h2>
     <p>{{item.info}}</p>
     </button>
    </ion-col>
    <ion-col>
      <ion-checkbox (ionChange)="fireEvent(i, $event)"></ion-checkbox>
   </ion-col>
  </ion-row>
 </ion-grid>

更多信息在这里：

https://ionicframework.com/docs/api/components/grid/Grid/

带有列表的按钮和复选框的离子列表

1 个答案: