-
Notifications
You must be signed in to change notification settings - Fork 0
Item
wenbobao edited this page Oct 12, 2017
·
2 revisions
ion-list-header,ion-item,[ion-item],ion-item-divider
一个ion-item可以包含文本、图像和其他任何东西。一般来说,它与其他item被放置在ion-list中。它很容易被swiped、删除、重新排序、编辑等等。。它需要一个ItemSliding包装器元素以被swiped。
A basic item
<ion-item>
Item
</ion-item>
A list header
<ion-list-header>
List Header
</ion-list-header>
An item divider
<ion-item-divider>
Item Divider
</ion-item-divider>
当项目可以被clicked或tapped时,属性ion-item可以添加到<button>中。当项目需要包含href时,它应该被添加到<a>元素中。可以将其添加为任何元素的属性,以进行项样式化。
<button ion-item (click)="buttonClick()">
Button Item
</button>
<a ion-item href="https://www.ionicframework.com">
Anchor Item
</a>
注意: 不要将ion-item作为属性,添加到<ion-list-header> or <ion-item-divider>中, 因为它们已经是一个 item。
默认情况下 <button> and <a>元素含有ion-item 属性时,将在iOS模式下先是一个右箭头图标。 隐藏图标需要在元素中添加属性detail-none, 如果需要显示的显示有图标,添加属性 detail-push
<ion-item detail-push>
Item with Detail Arrow
</ion-item>
<button ion-item (click)="buttonClick()">
Button Item with Detail Arrow
</button>
<a ion-item detail-none href="https://www.ionicframework.com">
Anchor Item with no Detail Arrow
</a>