离子2:如何使离子in-in-in-in-in-in-in-in-in-in-in-in-in-in-in-in-lis

Question

我有一个页面显示分支列表，然后选择一个分支要转到下一页。

如何使ion-item单击，捕获单击并选择项目？

我尝试了此代码，并且有效。但是，它显示了一个按钮列表。

 <ion-list>
    <ion-item *ngFor="let branch of branchArray">
       <button ion-button full (click)='goHome(branch)'>
          {{branch.name}}
       </button>              
    </ion-item>
 </ion-list> 

Answer 1

接受的答案并不完全正确。离子文档说（现在，在答案时可能有所不同）：

当不单击时，应该将基本项目写为<ion-item>元素。

及以后

当可以单击或点击该项目时，应将属性离子项目添加到<button>中。

因此，您应该使用此代码：

<ion-list>
    <ion-item button *ngFor="let branch of branchArray"  (click)='goHome(branch)'>
        <!-- Inner code here depending on your styling. -->
    </ion-item>
</ion-list>

这更改了离子项目的语义，然后将样式进行相应更新：您不需要破解CSS文件。

Answer 2

我认为显示按钮是一个UI问题。由于我不知道应该如何显示其确切要求，请查看如何在此处使用ion-list。您也可以根据您的要求在CSS中进行样式。

就可单击的部分而言：您也有效的是，但是，请单击此类物品：

<ion-list>
    <ion-item *ngFor="let branch of branchArray"  (click)='goHome(branch)'>
        <button ion-button full>
            {{branch.name}}
        </button>             
    </ion-item>
</ion-list>